Use this page as a starting point for learning how to add your own styles to blocks. Go ahead and open the Developer Tools and inspect a block to get started. You can refer to our CSS Classes here.

All Headings

Heading 1 <h1>

Heading 2 <h2>

Heading 3 <h3>

.notion-heading

h1.notion-heading

h2.notion-heading

h3.notion-heading

Text block Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus a pretium leo. Praesent eu sem nulla. In nunc arcu, rutrum eu malesuada sed, lacinia nec ipsum. Maecenas quis tincidunt sem. Quisque vitae nisl vel purus laoreet efficitur quis ut arcu. Nulla sit amet risus hendrerit, tristique augue eu, dapibus risus. Curabitur ullamcorper ligula lacus, sit amet pharetra neque interdum in.

<p>

.notion-text__content

Normal Text

<p>

.notion-text__content

Bold Text

<b>

strong

Italic Text

<em>

em

Underlined Text

<u>

u

Strikethrough Text

<s>

s

Linked Text

<a>

.notion-link link

BoardCode Text

<code>

.code

<div>

.notion-column-list

Column block 1

.notion-column

Column block 2

.notion-column

Column block 3

.notion-column

Link block →

<a>

.notion-link link