一键导入
ckm-slides
Create strategic HTML presentations with Chart.js, design tokens, responsive layouts, copywriting formulas, and contextual slide strategies.
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
菜单
Create strategic HTML presentations with Chart.js, design tokens, responsive layouts, copywriting formulas, and contextual slide strategies.
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
This skill should be used after visual-spec-review passes and before OpenSpec UI update or frontend implementation. It expands screenshot-derived visual specs into a production design system by adding interaction states, responsive behavior, accessibility rules, UX checklist, and implementation constraints without overriding UI type, layout paradigm, component tree, rejected assumptions, or asset strategy.
This skill should be used when the user asks to convert a PRD, OpenSpec change, or product idea into a structured GPT Image 2 UI prompt pack for generating high-fidelity flat UI reference images. It produces prompt materials, UI type decisions, variants, negative prompts, and reference selection checklists, not frontend code.
This skill should be used after Codex implements a UI change and before visual acceptance review. It audits source code against project-specific visual specs, design tokens, component tree, design-system rules, OpenSpec implementation strategy, UI type, layout paradigm, and asset strategy. It reports violations without redesigning or modifying code.
Use for UI/UX design intelligence in Codex: planning, building, reviewing, improving, or implementing web/mobile interfaces, landing pages, dashboards, design systems, components, accessibility, color palettes, typography, spacing, motion, charts, responsive layouts, and stack-specific frontend guidance. Provides searchable UI/UX Pro Max data with product patterns, 67 UI styles, 161 color palettes, 57 font pairings, UX guidelines, chart recommendations, and framework guidance.
This skill should be used after spec-compliance-review and before visual-diff-fix. It captures or analyzes actual browser screenshots and compares them against the reference design, responsive spec, visual tokens, layout spec, component tree, UI type, layout paradigm, and asset strategy. It outputs structured visual diff reports and fix-tasks without modifying code.
This skill should be used after visual-acceptance-review has generated fix-tasks.json. It applies precise visual fixes from structured diff tasks, preserves source-of-truth contracts, avoids redesign and unrelated refactors, validates each batch, and outputs resolved fix task reports.
| name | ckm:slides |
| description | Create strategic HTML presentations with Chart.js, design tokens, responsive layouts, copywriting formulas, and contextual slide strategies. |
| argument-hint | [topic] [slide-count] |
| metadata | {"author":"claudekit","version":"1.0.0"} |
Strategic HTML presentation design with data visualization.
$ARGUMENTS
| Subcommand | Description | Reference |
|---|---|---|
create | Create strategic presentation slides | references/create.md |
| Topic | File |
|---|---|
| Layout Patterns | references/layout-patterns.md |
| HTML Template | references/html-template.md |
| Copywriting Formulas | references/copywriting-formulas.md |
| Slide Strategies | references/slide-strategies.md |
$ARGUMENTS (first word)references/{subcommand}.md