SNIPPETariacintron
CSS Snippets
Readable, organized Obsidian CSS snippets designed to eliminate confusion (area-feature-mode file naming system)
CSSAny theme
# Obsidian-CSS-Snippets 🎛️
#### File Naming System:
`area-feature-mode.css`
#### Vocabulary - Legend 🔑
- area → where the snippet applies
- feature → what it changes
- mode → when it applies
#### Feature
Describes what the snippet changes or does.
Examples:
- `header-colors` → changes header colors
- `no-image-filenames` → hides image filenames
- `link-styles` → modifies link appearance
- `callouts` → styles callout blocks
- `sidebar-cleanup` → adjusts sidebar layout
- `card-layout` → changes layout structure
#### Area
- `canvas` ➝ canvas only
- `notes` ➝ markdown notes
- `global` ➝ everywhere
- `ui` ➝ app interface (menu, sidebars, etc.)
#### Mode
- `editor` → editing (source + live preview)
- `preview` → reading view (fully rendered)
- `global` → both / always active
#### Examples:
* canvas-no-image-filenames-preview.css
* global-header-colors-preview.css
#### Purpose
Readable, organized Obsidian CSS snippets designed to eliminate confusion (area-feature-mode file naming system)
### Notes
I’m still learning, but I wanted to share this system in case it helps others.
Constructive feedback is welcome.
How to Install
- Download the CSS file below
- Move it to your vault's
.obsidian/snippets/folder - Open Obsidian → Settings → Appearance → CSS Snippets → Enable it
Stats
Stars
0
Forks
0
License
MIT
Last updated 7h ago