ai-agent

obsidian-style-settings

Name: obsidian-style-settings
Author: community-archive

A dynamic user interface for adjusting theme, plugin, and snippet CSS variables within Obsidian

2,540 stars+11★ this week186 forksTypeScriptUpdated 7/13/2026100% free · open source

What it does

Obsidian-style-settings allows you to dynamically adjust theme, plugin, and snippet CSS variables within Obsidian through a user-friendly interface

When to use it

•You want to customize the look and feel of your Obsidian notes without manually editing CSS files
•You need to switch between different themes or styles for different projects or workflows
•You want to test and preview various CSS settings before applying them to your entire Obsidian setup

Ready-to-paste prompt

Open the Style Settings interface and use the 'Edit CSS' button to add a new snippet with the following code: `--background-primary: #333;` to change the background color of your Obsidian notes

Heads up: Make sure you have Obsidian version 0.10.6 or higher installed to use the Style Settings plugin, as it relies on features introduced in this version

Saves to your device

Use with Claude

New

Skip the builder — one click puts this in Claude, Cursor, Antigravity and more.

🛠️ Technical setup

Expect 20–40 minutes in a terminal — or let your AI agent drive it.

Try it instantly — no install

Claude Code

mkdir -p ~/.claude/skills/obsidian-style-settings && curl -fsSL https://workflowstacks.com/api/skills/obsidian-style-settings/claude-skill -o ~/.claude/skills/obsidian-style-settings/SKILL.md

Open in another AI app

Opens the app with this repo with the prompt ready to go — no copy-paste needed.

Connect the whole catalog (MCP)

claude mcp add --transport http workflowstacks https://workflowstacks.com/api/mcp

Adds a WorkflowStacks connector to Claude Code: search and load any skill here by chatting.

How obsidian-style-settings works

Codeflow

Free to inspect

Obsidian-style-settings is a medium TypeScript project (~3.1k lines across 59 code files). Expect some technical setup — comfortable with a terminal, or ask a developer. Last commit 3 months ago, GPL-3.0 license, has a test suite.

Size

Medium codebase

~3.1k lines · 59 code files · 26 min skim

Setup

Some technical setup

Comfortable with a terminal? 20–40 min. Otherwise ask a dev.

Runs on

Node.js

No API keys detected

TypeScript 79%CSS 19%JavaScript 3%

Where to start reading

1
README.md
Start here — what it does and how to install it
2
main.css
Where the program starts running
3
package.json
Dependencies and the commands it exposes
4
src/main.ts
Inside src/ — the main logic begins here

What's in each folder

src/Core code — the actual logic54 files

screenshots/Folder1 files

.github/CI / automation (GitHub Actions)2 files

READMEHas testsDocumentedCI checksGPL-3.0 licenseUpdated 3 mo ago

Use with Claude

New

Skip the builder — one click puts this in Claude, Cursor, Antigravity and more.

🛠️ Technical setup

Expect 20–40 minutes in a terminal — or let your AI agent drive it.

Try it instantly — no install

Claude Code

mkdir -p ~/.claude/skills/obsidian-style-settings && curl -fsSL https://workflowstacks.com/api/skills/obsidian-style-settings/claude-skill -o ~/.claude/skills/obsidian-style-settings/SKILL.md

Open in another AI app

Opens the app with this repo with the prompt ready to go — no copy-paste needed.

Connect the whole catalog (MCP)

claude mcp add --transport http workflowstacks https://workflowstacks.com/api/mcp

Adds a WorkflowStacks connector to Claude Code: search and load any skill here by chatting.

Quick Actions

Details

Creator

community-archive

Language

TypeScript