agentskills.codes
FI

fishmark-theme-authoring

by yulu-gmDesignSource

Ensures FishMark theme packages meet all runtime architecture requirements.

UI designFrontend

Install

mkdir -p .claude/skills/fishmark-theme-authoring && curl -L -o skill.zip "https://agentskills.codes/api/skills/download/13020" && unzip -o skill.zip -d .claude/skills/fishmark-theme-authoring && rm skill.zip

Installs to .claude/skills/fishmark-theme-authoring

Activation

This is the description your AI agent reads to decide when to run this skill — the better it matches your request, the more reliably it fires.

用于在 FishMark 仓库中创建、修改或审查主题时，快速约束 AI 按当前 theme package 架构工作，避免依赖过期目录结构、预留字段或不完整资源，导致主题无法扫描、无法回退或进入软件后失效。
103 charsno explicit “when” trigger
Intermediate

Key capabilities

  • →Constrain theme development to the current architecture
  • →Ensure theme packages are scannable, switchable, and revertible
  • →Require `manifest.json` for every theme package
  • →Enforce specific style layers (`ui.css`, `editor.css`, `markdown.css`)
  • →Validate Markdown text geometry against a standard

How it works

The skill enforces a specific theme package architecture, requiring a manifest and defined style layers, and validates compliance against a Markdown text rendering standard.

Inputs & outputs

You give it
Theme package files and `manifest.json`
You get back
A valid FishMark theme package that can be scanned, switched, and reverted

When to use fishmark-theme-authoring

  • →Creating new FishMark themes
  • →Updating theme style layers
  • →Verifying theme structure
  • →Reviewing theme manifest

About this skill

FishMark 主题编写

只在做 FishMark 主题时使用这个 skill。目标不是写出“最炫”的主题，而是先保证主题包能被扫描、切换、回退，并在动态效果失效时仍可用。

当前主题模型

  • 只允许 theme package
  • 内置主题目录：src/renderer/theme-packages/<id>/
  • 社区主题目录：<userData>/themes/<id>/
  • 每个主题包都必须有 manifest.json
  • renderer 按顺序挂载：tokens -> ui -> titlebar -> editor -> markdown
  • 选中主题缺失或不支持当前模式时，自动回退到内置 default

不要再使用旧的“主题家族 + light/dark 子目录自动拼装”思路。

硬边界

  • id、name 必须非空
  • supports.light / supports.dark 必须明确写
  • 对应支持的模式，必须提供对应 tokens
  • 生产级主题最少提供：
    • styles/ui.css
    • styles/editor.css
    • styles/markdown.css
  • Markdown 文本几何必须符合 docs/standards/markdown-text-rendering-standard.json
  • manifest 里的所有路径都必须留在主题包根目录内
  • 静态 CSS 层必须独立可读，不能把可用性押在 shader 上

现在不要依赖

  • layout.titlebar
  • surfaces.welcomeHero

它们目前只是 schema 预留，不是可依赖的运行时能力。

Markdown 文本样式标准

docs/standards/markdown-text-rendering-standard.json 是 Markdown 文本渲染的唯一几何标准。

主题可以控制：

  • Markdown 颜色 semantic slots
  • 字体族与字体大小入口
  • 装饰性的背景、边框、阴影和动态效果

主题不可以覆盖：

  • 列表层级缩进距离
  • marker 与首个正文字符的视觉距离
  • active / inactive 列表软换行对齐规则
  • 段落、列表、引用、代码块、表格行高目标
  • 负字间距

如果主题 styles/markdown.css 与该 JSON 冲突，主题验收必须判 FAIL。

最小可用结构

my-theme/
  manifest.json
  tokens/
    dark.css
  styles/
    ui.css
    editor.css
    markdown.css

{
  "id": "my-theme",
  "name": "My Theme",
  "version": "1.0.0",
  "supports": { "light": false, "dark": true },
  "tokens": { "dark": "./tokens/dark.css" },
  "styles": {
    "ui": "./styles/ui.css",
    "editor": "./styles/editor.css",
    "markdown": "./styles/markdown.css"
  },
  "layout": { "titlebar": null },
  "scene": null,
  "surfaces": {},
  "parameters": []
}

如果要做动态主题

  • 只使用 surfaces.workbenchBackground 和 surfaces.titlebarBackdrop
  • kind 只能是 "fragment"
  • surface 必须引用存在的 scene.id
  • 参数需要进 shader 时才写 uniform
  • 即使 shader 编译失败，主题也必须仍然可读
  • shader请使用WebGL1 (GLSL ES 1.00)

交付前检查

  • 主题目录能被扫描到
  • manifest.json 合法
  • 切换主题后应用不白屏、不崩溃
  • 主题缺失或模式不支持时能回退到 default
  • 主题缺少某个 style part 时不会残留旧主题样式
  • 动态效果设为 off 时主题仍正常显示

参考实现：

  • 默认主题：src/renderer/theme-packages/default/
  • 动态主题参考：fixtures/themes/rain-glass/

需要完整背景时再看： docs/theme-authoring-guide.md

When not to use it

  • →When working on non-FishMark themes
  • →When relying on outdated directory structures or reserved fields
  • →When expecting dynamic effects to be the primary usability factor

Limitations

  • →Only allows `theme package` model
  • →Does not allow overriding list indentation or marker distances in Markdown
  • →Does not support `layout.titlebar` or `surfaces.welcomeHero` as they are schema reserved

How it compares

This skill ensures themes adhere to a strict, current architecture for FishMark, preventing compatibility issues that arise from unconstrained theme development.

Compared to similar skills

fishmark-theme-authoring side by side with the closest alternatives in the catalog.

SkillInstallsUpdatedSafetyDifficulty
fishmark-theme-authoring (this skill)03moNo flagsIntermediate
ui-ux-pro-max1,9095moReviewIntermediate
svg-precision5274moReviewIntermediate
mobile-android-design1012moNo flagsIntermediate

Try saying

Example prompts that trigger this skill in your AI assistant.

More by yulu-gm

View all by yulu-gm →

fishmark-release

yulu-gm

用于在 FishMark 仓库中执行正式 release 发版，适合需要升级版本号、整理 GitHub Release 正文、发布 Windows 安装包或预留 macOS 发版时使用。

00

You might also like

ui-ux-pro-max

nextlevelbuilder

UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 8 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app, .html, .tsx, .vue, .svelte. Elements: button, modal, navbar, sidebar, card, table, form, chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, flat design. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient.

1,9092,023

svg-precision

dkyazzentwatwa

Deterministic SVG generation, validation, and rendering. Use for icons, diagrams, charts, UI mockups, or technical drawings requiring structural correctness and cross-viewer compatibility.

5271,229

mobile-android-design

wshobson

Master Material Design 3 and Jetpack Compose patterns for building native Android apps. Use when designing Android interfaces, implementing Compose UI, or following Google's Material Design guidelines.

101335

frontend-slides

sickn33

Create stunning, animation-rich HTML presentations from scratch or by converting PowerPoint files. Use when the user wants to build a presentation, convert a PPT/PPTX to web, or create slides for a talk/pitch. Helps non-designers discover their aesthetic through visual exploration rather than abstract choices.

95195

scroll-experience

davila7

Expert in building immersive scroll-driven experiences - parallax storytelling, scroll animations, interactive narratives, and cinematic web experiences. Like NY Times interactives, Apple product pages, and award-winning web experiences. Makes websites feel like experiences, not just pages. Use when: scroll animation, parallax, scroll storytelling, interactive story, cinematic website.

101142

penpot-uiux-design

github

Comprehensive guide for creating professional UI/UX designs in Penpot using MCP tools. Use this skill when: (1) Creating new UI/UX designs for web, mobile, or desktop applications, (2) Building design systems with components and tokens, (3) Designing dashboards, forms, navigation, or landing pages, (4) Applying accessibility standards and best practices, (5) Following platform guidelines (iOS, Android, Material Design), (6) Reviewing or improving existing Penpot designs for usability. Triggers: "design a UI", "create interface", "build layout", "design dashboard", "create form", "design landing page", "make it accessible", "design system", "component library".

27145

Search skills

Search the agent skills registry