Best practices

Generally, all text should be contained within one singular <p> tag. Example:

<p>
    Hi there! This is a message containing normal text
</p>

New lines

To create a new line, you can use the <br> tag. Example:

<p>
    Hi there! This is a message containing normal text
    <br>
    This is a new line!
</p>

Which will render as:

Hi there! This is a message containing normal text
This is a new line!

Text sizes

OnlyFans has the following text size options:

  • Largest
  • Large
  • Default
  • Small
  • Smallest

You can use them as follows:

Smallest

To create the smallest text, you can use the <span class="m-editor-fs__sm"> tag. Example:

<p>
    Hi there! This is a message containing normal text
    <span class="m-editor-fs__sm">This is the smallest text!</span>
</p>

Small

To create a small text, you can use the <span class="m-editor-fs__s"> tag. Example:

<p>
    Hi there! This is a message containing normal text
    <span class="m-editor-fs__s">This is a small text!</span>
</p>

Large

To create a large text, you can use the <span class="m-editor-fs__l"> tag. Example:

<p>
    Hi there! This is a message containing normal text
    <span class="m-editor-fs__l">This is a large text!</span>
</p>

Largest

To create the largest text, you can use the <span class="m-editor-fs__lg"> tag. Example:

<p>
    Hi there! This is a message containing normal text
    <span class="m-editor-fs__lg">This is the largest text!</span>
</p>

Text styles

When using text styles like bold or italic, make sure that you wrap the text in a <span class="m-editor-fs__default"> tag. Example:

<span class="m-editor-fs__default">
    <strong>Bold text</strong>
    <em>Italic text</em>
</span>

Bold

To create bold text, you can use the <strong> tag. Example:

<p>
    Hi there! This is a message containing normal text
    <span class="m-editor-fs__default"><strong>This is bold text!</strong></span>
</p>

Italic

To create italic text, you can use the <em> tag. Example:

<p>
    Hi there! This is a message containing normal text
    <span class="m-editor-fs__default"><em>This is italic text!</em></span>
</p>

Text colors

OnlyFans has three possible colors for text:

  • Gray (#8a96a3)
  • Blue 1 (#00aff0)
  • Blue 2 (#1b98e0)

You can use them as follows:

Gray

To create gray text, you can use the <span class="m-editor-fs__default m-editor-fc__gray"> tag. Example:

<p>
    Hi there! This is a message containing normal text
    <span class="m-editor-fs__default m-editor-fc__gray">This is gray text!</span>
</p>

Blue 1

To create blue 1 text, you can use the <span class="m-editor-fs__default m-editor-fc__blue-1"> tag. Example:

<p>
    Hi there! This is a message containing normal text
    <span class="m-editor-fs__default m-editor-fc__blue-1">This is blue 1 text!</span>
</p>

Blue 2

To create blue 2 text, you can use the <span class="m-editor-fs__default m-editor-fc__blue-2"> tag. Example:

<p>
    Hi there! This is a message containing normal text
    <span class="m-editor-fs__default m-editor-fc__blue-2">This is blue 2 text!</span>
</p>