Inline CSS for a document

When working with CSS, it would useful to add the css o a page and have it rendered in preview. So I might add something like this to my file in edit mode:

h1 {color:red}

and then the page would render all h1’s with red color.

this is useful for prototyping CSS and one off scenarios at a file level.


Obsidian already supports this natively since version 0.9.18:

You can now give notes specific CSS classes using the front matter option cssclass. You can also specify multiple ones with the same syntax as tags and aliases, for example, cssclass: class1, class2. Combine this with custom CSS to selectively style notes.

It supports cssclasses yes, but often adding a snippet for a single document that needs custom styling adds to clutter and writing friction.

1 Like

This shouldn’t be a plugin, but rather a builtin feature.

Assigning css classes to a note using cssclass is only useful if you use it on more than one note. Sometimes you just need a specific css “hack” on only one note.