Search...Search plugins and themes...
⌘K
Sign in
  • Get started
  • Download
  • Pricing
  • Enterprise
  • Account
  • Obsidian
  • Overview
  • Sync
  • Publish
  • Canvas
  • Mobile
  • Web Clipper
  • CLI
  • Learn
  • Help
  • Developers
  • Changelog
  • About
  • Roadmap
  • Blog
  • Resources
  • System status
  • License overview
  • Terms of service
  • Privacy policy
  • Security
  • Community
  • Plugins
  • Themes
  • Discord
  • Forum / 中文论坛
  • Merch store
  • Brand guidelines
Follow us
DiscordTwitterBlueskyThreadsMastodonYouTubeGitHub
© 2026 Obsidian

Composer

vran-devvran-dev19k downloads

simple and pretty theme for obsidian & components plugin

Add to Obsidian
Composer screenshot
  • Overview
  • Scorecard
  • Updates15

中文 | English

Brief

an out-of-box theme for Obsidian, which is designed for reading and writing comfortably.

Screenshots

You can install style settings plugin and change the theme color in the plugin setting.

Color Scheme

[!NOTE] color scheme change needs to install style settings plugin

  • Xiá 霞

xia light

xia dark

  • Sù 素

su light

su dark

  • Qīng 青

qing light

qing dark

Text Formatting

text formatting

Table Style

table style

Callout Style

callout style

Thanks

  • Task checkbox is referenced from Minimal Theme which is a great theme for Obsidian build by @Kepano

Development Workflow (settings.yml + composer.css Split)

This theme now separates the Style Settings YAML header from the CSS for better editor support.

Files:

  • settings.yml – Pure YAML (no wrapping comment). Edit Style Settings options here.
  • composer.css – Pure CSS body (without the initial /* @settings ... */ block).
  • build.mjs – Build script that merges the two into theme.css.

Usage:

  1. Edit style settings in settings.yml.
  2. Edit styles in composer.css.
  3. Run npm run build to generate theme.css.
  4. Load or distribute theme.css as the final theme file.

Release Flow: npm version patch|minor|major will automatically:

  1. Run preversion (which triggers npm run build).
  2. Bump version and stage manifest.json, versions.json, and theme.css.

Notes:

  • Do NOT manually edit the YAML inside theme.css; it will be regenerated.
  • Only add/change settings in settings.yml.
  • The build script strips an optional leading comment block from composer.css before concatenation.

Future Enhancements (Optional):

  • YAML schema validation (e.g. with js-yaml) to catch structural errors.
  • Skip rewriting theme.css when no changes occur (quieter diffs).
  • Support multiple YAML fragments under a settings/ directory auto-merged at build time.

Rollback to single file (if desired):

  1. Run npm run build.
  2. Keep resulting theme.css.
  3. Remove settings.yml, composer.css, and build.mjs.

Feel free to open an issue if you’d like these enhancements implemented.

HealthExcellent
ReviewSatisfactory
About
Read and write comfortably with a clean, readable layout tuned for long-form notes. Switch color schemes and tweak typography, table and callout styles, and task checkbox visuals with the Style Settings plugin.
Details
Current version
0.7.0
Last updated
Last week
Created
2 years ago
Updates
15 releases
Downloads
19k
License
MIT
Report bugRequest featureReport theme
Sponsor
Buy Me a Coffee
Author
vran-devvran-dev
github.com/vran-dev
GitHubvran-dev
  1. Community
  2. Themes
  3. Composer

Related themes

ITS Theme screenshot

ITS Theme

Minimal screenshot

Minimal

GitHub Theme screenshot

GitHub Theme

Things screenshot

Things

Shimmering Focus screenshot

Shimmering Focus

Cupertino screenshot

Cupertino

Wasp screenshot

Wasp

Baseline screenshot

Baseline

Prism screenshot

Prism

Velocity screenshot

Velocity