Mark Highlight System Guide

🤔 What is the Mark Highlight System?

Obsidian doesn't have a native highlighting option (mostly due to staying compliant with the markdown standard). As a result, Prism implements this feature utilising the HTML <mark> tags which once encapsulating your text allows it to be styled.

🖍️ Using Mark Highlights

Here is an example showcasing a simple use case for the Mark Highlights, highlighting some text in Red:

<mark class="red">This highlighted text is Red</mark>

Resulting in the following styling:

You can change the red class for any of the following colours:

• grey / Grey
• red / Red
• orange / Orange
• yellow / Yellow
• green / Green
• mint / Mint
• cyan / Cyan
• blue / Blue
• purple / Purple
• pink / Pink

In Style Settings under Prism Theme -> Editor -> Mark Highlight -> Light Theme OR Dark Theme, you can customise the Default Style used for the highlights.

Here is how each option looks:

Default	Border	Filled	Border and Filled

You will also find an option to disable the text colour. Makes highlights use the default Editor text colour instead.

Here is how it looks when using the Default Text Color Preset option for each Style option again:

Default	Border	Filled	Border and Filled

🎨 Overwriting the Default styling

I've implemented overwrite classes which you can add to your Mark Highlights to independently set the style for a specific highlight despite what is set in the Style Option and Text Color Preset in Style Settings. Here's an example:

<mark class="mint mark-filled mark-text-color">This highlighted text is Mint</mark>

Resulting in the following styling:

Available options for changing the Style:

• mark-default
• mark-border
• mark-filled
• mark-borderandfilled

Available options for changing the Text Color Preset:

• mark-text-default
• mark-text-color

💫 Using the UI Accent Colour for a Mark Highlight

You can create a highlight which uses the UI Accent Colour by not specifying the colour class.

If you want to use the UI Accent Colour and the Mark Highlight options set in Style Settings (no overwrites), you can do the following:

<mark class>This highlighted text is using the UI Accent Colour and options set in Style Settings</mark>

Resulting in the following styling (Used Green UI Accent Colour, Border Style Option and Default Text Color Preset in Style Settings):

Here is an example of a Mark Highlight when the UI Accent Colour is set to Red and while using overwrite classes:

<mark class="mark-filled mark-text-default">This highlighted text is Accent</mark>

Resulting in the following styling:

📑Mark Highlight Shortcuts using the Text Format Plugin

Courtesy of @ShahriarKh, a guide on how to do this is available here:
https://github.com/damiankorcz/Prism-Theme/wiki/Mark-Highlight-Shortcuts-using-the-Text-Format-Plugin