Design

Headings

Headings help users and search engines to read and understand text.

Heading 1

Content Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus.

Heading 2

Content Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus.

Heading 3

Content Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus.

Toggle Headings

Allows you to create collapsible blocks with a large heading

Paragraph

Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus. Et legere ocurreret pri, animal tacimates complectitur ad cum. Cu eum inermis inimicus efficiendi. Labore officiis his ex, soluta officiis concludaturque ei qui, vide sensibus vim ad.

Another one Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus. Et legere ocurreret pri, animal tacimates complectitur ad cum. Cu eum inermis inimicus efficiendi. Labore officiis his ex, soluta officiis concludaturque ei qui, vide sensibus vim ad.

Bold

This is a bold text

Italic

This is an italicized text

Underline

This is an underlined text

Strikethrough

This text has a strikethrough

Code

This text is displayed as code

Inline Equation

Mass–energy equivalence: $E = mc^2$

Link

Here's is a link to my GitHub

Line Break

A blank paragraph is treated as <br/>

Comments

This text has a comment

Colors

default gray brown orange yellow green blue purple pink red gray_background brown_background orange_background yellow_background green_background blue_background purple_background pink_background red_background

Useful for highlighting important stuff that need the most attention.

Block Color

1. Text color of this block is gray
2. Text color of this block is brown
3. Text color of this block is pink
4. Text color of this block is red
5. Text color of this block is orange
6. Text color of this block is yellow
7. Text color of this block is green
8. Text color of this block is blue
9. Text color of this block is purple

• Background color of this block is gray
• Background color of this block is brown
• Background color of this block is pink
• Background color of this block is red
• Background color of this block is orange
• Background color of this block is yellow
• Background color of this block is green
• Background color of this block is blue
• Background color of this block is purple

Nested Text

At level one long Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.

<script>alert('xss');</script>

Horizontal Rule

Blockquote

“Come on, baby! Do the magic hand thing” — Greef Karga

Lists

Unordered List

• Item 1
• Item 2 Long Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.

  The HTML <hr> element is for creating a "thematic break" between paragraph-level elements.

  • this is a nested list
    • Lorem Ipsum is simply dummy text of the printing and typesetting industry.
• Item 3

Ordered List

1. Item 1
2. Item 2 Long Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.
   1. Item 2.1
      1. ltem 2.1.i
3. Item 3

To-do List

Toggle List

Callout

A callout with an emoji.

A callout with an uploaded image

A callout with a external image

Callout in callout. Long Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.

Block Equation

Here's the infamous Quadratic Formula for finding the roots of a Quadratic Equation

Mention

User: Lorem Ipsum Maximous Black is simply dummy text of the printing and typesetting industry

Page: Lorem Ipsum Uses is simply dummy text of the printing and typesetting industry

GitHub:

• repo: maximousblk/maximousblk.me
• pr: maximousblk/maximousblk.me#241
• issue: denoland/deno#25

Date:

• simple: Mar 12, 2021
• range: Oct 1, 2021 -> Oct 30, 2021
• with time: Oct 2, 2021, 8:00:00 AM
• with time: Oct 2, 2021, 1:00:00 PM
• @today: Dec 10, 2022
• @Sunday: Dec 4, 2022
• Reminder: Nov 6, 2021, 3:30:00 AM

Page Link

Sub Page

Simple Table

Database

Media

Image

Video

Audio

PDF

File

Bookmarks

Maximous Black

I'm a Web Developer who likes building beautiful web interfaces & experiences.

https://maximousblk.me/

Deno for JavaScript Beginners

So, you’re trying to learn JavaScript. You have just gotten a bit fluent with JavaScript in the browser. Then all of a sudden, you come across Deno and the #NodeKiller hype. But you don’t know what any of these are. If that’s the case, read on!

https://maximousblk.me/posts/deno-for-javascript-beginners

Open Graph protocol

The Open Graph protocol enables any web page to become a rich object in a social graph.

https://ogp.me/

Link Preview

BREAKING: Migrate to NextJS 14 by maximousblk · Pull Request #568 · maximousblk/maximousblk.me

TODO Switch to pnpm add Vercel Analytics (evaluate umami v2) Add NextJS 13 Font Optimizations Add NextJS 13 Loading UI Add NextJS 13 Error Boundaries Use React 18 Streaming and Suspense for ...

https://github.com/maximousblk/maximousblk.me/pull/568

Code Blocks

/* This is a comment. (link for more info) */
function foo() {
  const color = "bar"
  return color;
  console.log("dead code");
}

Template

Breadcrumb

Synced Block

A "Container" block (a callout), let's call it A.

This is a synced block

A "Reference" block that is pasted after clicking "Copy and sync" in A, let's call it B.

This is a synced block

A "Reference" block that is pasted after clicking "Copy and sync" in B, let's call it C.

This is a synced block

Columns

3 column divide:

2 column divide:

Embeds