Precision colors for machines and people
This is a recolor for Obsidian based on Ethan Schoonover's Solarized color scheme. Works as of Obsidian v1.0.01.
If anything is not working for you, please let me know here.
Please weigh in on this discussion: Should fonts be included, or not?.
Some outtakes from Ethan Schoonover's full write-up:
Solarized reduces brightness contrast but, unlike many low contrast colorschemes, retains contrasting hues (based on colorwheel relations) for syntax highlighting readability.
Solarized retains the same selective contrast relationships and overall feel when switching between the light and dark background modes. A lot of thought, planning and testing has gone into making both modes feel like part of a unified colorscheme.
The monotones have symmetric CIELAB lightness differences, so switching from dark to light mode retains the same perceived contrast in brightness between each value. Each mode is equally readable. The accent colors are based off specific colorwheel relations and subsequently translated to CIELAB to ensure perceptual uniformity in terms of lightness.
- This theme respects Obsidian's accent color setting, so you can set that to any of Solarized's accent colors. This is then used to color UI elements and checkboxes, among others.
Find this theme in the Obsidian's community themes browser under Settings > Appearance > Themes. If that doesn't work, double-check if you are running the latest version of Obsidian.
Make changes in the scss
files and compile theme.scss
into theme.css
using something like dart-sass.
I use the .vscode/tasks.json
to compile with ctrl+shift+B in VSCodium.
Don't forget to update the version number in manifest.json
.
You can add a tag to a commit with git tag v1.0.8-beta
. Then git push origin main --tags
.
All notable changes to this project will be documented here.
The format is based on Keep a Changelog, and this project adheres to Semantic Versioning.
- Do not use monospace font for editing view (see #33)
- Fix strikethrough of links in editing view
- Do not adjust font sizes
- Delete legacy
obsidian.css
- Highlight active line in editor
.vscode/tasks.json
(see How to develop)- Support for the Dynamic Highlights plugin
- Yellow highlights to differentiate from other highlights
- Use existing
--code-size
variable for size of monospace fonts in editor and preview - Color checkboxes in editing view
- Color selected file in file explorer and more contrast when flashing
- More contrast in highlight when clicking from outline tab
- Color search results green to differentiate from other highlights
- Color border of focussed UI element
- Use less pronounced background colors for input elements in settings menu
- More consistent colors for internal, unresolved and external links
- Bold table headers
- Use accent color for vim cursor
- Use accent color for search results and highlights
- Use accent color for frontmatter dashes and parameters
- Use accent color for checkboxes in both editing and reading view
- Follow Ethan Schoonover's examples more closely for code formatting (fixing #27)
- Orange as default accent color
- Some control elements in the settings menu that were invisible in dark mode
- Using SCSS instead of plain CSS for cleaner development
- Overwriting Obsidian's default CSS variables instead of overwriting actual CSS rules, where possible
Footnotes
-
Older versions of Obsidian might still be able to use the old
obsidian.css
, but there won't be any support going forward. ↩