AgentSkillsCN

obsidian-dev-themes

Obsidian 主题的 CSS/SCSS 开发模式。在处理 theme.css、SCSS 变量，或 CSS 选择器时，这一功能将为您带来极大便利。

SKILL.md
--- frontmatter
name: obsidian-dev-themes
description: CSS/SCSS development patterns for Obsidian themes. Load when working with theme.css, SCSS variables, or CSS selectors.

Obsidian Theme Development Skill

This skill provides patterns and rules for developing Obsidian themes, focusing on CSS/SCSS development, styling conventions, and theme-specific coding practices.

Purpose

To ensure consistent theme development, proper CSS organization, and adherence to Obsidian's theming patterns and CSS variable usage.

When to Use

Load this skill when:

  • •Writing or modifying CSS/SCSS for theme.css
  • •Working with Obsidian's CSS variables and theming system
  • •Implementing responsive design or dark/light mode support
  • •Debugging CSS layout or styling issues
  • •Following CSS/SCSS coding conventions

Core Rules

  • •Use Obsidian CSS Variables: Always prefer Obsidian's built-in CSS variables over hardcoded values
  • •Follow BEM Methodology: Use Block-Element-Modifier naming for CSS classes
  • •Mobile-First: Consider mobile layouts and responsive design
  • •Dark/Light Mode Support: Test themes in both light and dark modes
  • •Performance: Minimize CSS complexity and avoid expensive selectors

Bundled Resources

  • •references/theme-best-practices.md: Essential CSS patterns and Obsidian variable usage
  • •references/theme-coding-conventions.md: CSS/SCSS style guidelines and naming conventions