This repository is a collection of CSS snippets for the note taking application Obsidian.

There are quite a few snippet collections by the Obsidian community. Here are some of the reasons I decided to make my own:

• I do not really know where to begin to contribute to all of them
• I wish to showcase some of the more niche snippets I found or made, especially those from my theme flexcyon.
• Utilities like the bundled snippet extraction script can be used in other snippet collections

View this directory for the snippets

• Accessibility
• ASCII Art in new tab
• Vim Mode Status
• Callouts
  • Callout color
  • Callout extended color
  • No Icon/Background
  • Horizontal/vertical alignment
  • Vertical alignment
  • Text transform
  • and many others...

Enclose your snippet(s) of interest like this

/* obsi-snip-coll start */
body {
    font-size: 1.2rem;
}
/* obsi-snip-coll end */

Make use of the extraction script.

Ensure you have Python installed (check with which python, install it on Windows)

Follow the supported .env formats to configure target sources:

• Single source
• Multiple sources

cp .env.dev-2 .env
vim .env

Set permissions if you are on Linux.

chmod +x ./extract-snippets.py

Run the script.

./extract-snippets.py

/* obsi-snip-coll start: font-size */
body {
    font-size: 1.2rem;
}
/* obsi-snip-coll end */

If the same source and name (in this case font-size) matches what is found in the metadata file it would load the descriptors for you. This means you should only need to enter descriptors once, or can edit the completion options manually here.

This also means you can define descriptors before you ever run the script if you assign each snippet with their names and input their name when prompted

The script never relies on line numbers alone, it follows this hierarchy to identify and manage snippets:

1. Minified CSS Content Match
2. Line Count Match with Proximity Check
3. Fallback and Prompting

A standardised, theme and vault agnostic means of extracting CSS snippets into my CSS snippet collection.

Error message, crash when metadata after exiting and re-entering metadata for new snippets.

Remove metadata.json. When you run the script again, it will generate an updated version in its place.

PRs, Issues, Bug Reports are welcome. I hope that the script and snippets would be useful to the community :D

• efemkay / Obsidian Modular CSS Layout
• HandaArchitect / obsidian-banner-snippet

• r-u-s-h-i-k-e-s-h / Obsidian CSS Snippets
• The wonderful #appearance community on the Obsidian Members' Group Discord