Obsidian Theme Designer

中文 | English

Никакого метода проб и ошибок. Проектируйте тему Obsidian визуально прямо в браузере.

Скилл для Claude Code, который проведёт вас через создание кастомной темы Obsidian — шаг за шагом, визуально, с живым превью в браузере. Знание CSS не требуется.

Как это работает

Шаг 1: Выберите стилевое направление

Выберите одно из 5 визуальных направлений — каждое показано в виде живого макета, а не просто подписи.

Шаг 2: Подберите цвета

Выберите холодные, тёплые или нейтральные тона. Результат отображается мгновенно.

Шаг 3: Найдите свои шрифты

Просматривайте 8–10 выразительных пар шрифтов, отрендеренных с вашим реальным контентом. Комбинируйте по своему вкусу — выбирайте китайский шрифт из одной карточки, английский — из другой.

Шаг 4: Предпросмотр и доработка

Оцените готовую тему в полноценной симуляции Obsidian — боковая панель, редактор, светлый и тёмный режим рядом. Итерируйте до идеального результата.

Шаг 5: Установка в один клик

Скилл генерирует CSS-сниппет, устанавливает шрифты и точно объясняет, как включить тему в Obsidian. Готово.

Возможности

• Визуальный подход — каждый выбор отображается в браузере, а не описывается текстом
• Двуязычные превью — все превью включают смешанный контент на китайском и английском
• Умный подбор шрифтов — использует скилл frontend-design для выбора выразительных, небанальных шрифтов
• Два режима — светлая и тёмная тема с независимыми акцентными цветами
• Автоустановка шрифтов — загружает и устанавливает Google Fonts в систему (Windows/macOS/Linux)
• Дружелюбно для не-дизайнеров — понятные аналогии («как PDF из LaTeX»), рекомендуемые настройки по умолчанию, поддержка референсных изображений

Быстрый старт

1. Скопируйте obsidian-theme-designer/ в ~/.claude/skills/
2. Откройте папку вашего хранилища Obsidian в Claude Code
3. Напишите: «Design my Obsidian theme»

Требования

• Claude Code
• Плагин superpowers (для превью в браузере через Visual Companion)
• Плагин frontend-design (опционально, для подбора шрифтов)

Лицензия

MIT