본문으로 건너뛰기
cccskills

스킬 찾기

483건 ・ 연동 도구: Figma · 인기순

clone-ui

무료

Pixel-faithful clone of any web UI into the user's existing stack, using whatever sources are available — a screenshot alone, a live URL, raw HTML/CSS, or any combination. Use this skill whenever the user wants to recreate, match, replicate, or "clone" a design from a screenshot, image, URL, Figma export, or HTML dump. Trigger on phrases like "clone this", "match this design", "build this from screenshot", "recreate this page", "make it look like this", "rebuild this UI", "copy this layout", or any time the user provides a visual reference and asks for a faithful implementation. Do not undertrigger — even if the user just drops a screenshot without explicit phrasing, this skill applies.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

santowilem/skills172026년 5월 11일 업데이트

**未導入プロジェクト向け**の sparkle-design 初期導入・セットアップを支援するスキル。 npm インストール、sparkle-design-cli による初回 CSS 生成、sparkle.config.json の 新規作成、AI ガード(Sparkle Design Guard)の導入、コンポーネント選択ガイドまでをカバー。 **導入済みプロジェクトでテーマ(primary / font / radius)を変えたい場合は `change-sparkle-config` スキルを使うこと** — この setup スキルは初期導入専用。 「Sparkle Design を導入」「sparkle-design をインストール」「デザインシステムをセットアップ」 「コンポーネントライブラリを追加」「どのコンポーネントを使えばいい」で発動。 English: "install sparkle-design", "add sparkle design", "set up sparkle design", "which component should I use"

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

goodpatch/sparkle-design172026년 10월 19일 업데이트

**導入済みの sparkle-design プロジェクト**で、ユーザーが目指したい「雰囲気」を 自然言語で伝えたら、`sparkle.config.json` の primary / font-pro / font-mono / radius を 書き換えて `sparkle-design-cli generate` まで実行するスキル。選択肢は Theme Settings Figma プラグインが扱える範囲(primary 7 色 / radius 8 段階 / fonts 11 種)に揃えて おり、Figma と CLI の見た目がずれません。**未導入プロジェクトの初期セットアップは `setup-sparkle-design`(internal 環境では `install-sparkle-design`)を使うこと。** 「雰囲気を変えたい」「もっとポップに」「ビジネスライクに」「高級感を出したい」 「primary を変えたい」「角丸をもっと丸く」「フォントを変えたい」「テーマを提案して」 「テナントごとに配色を変えたい」「役割ごとに色を出し分けたい」(後者2つは複数 バリアント要望として範囲外に誘導するために発動) で発動。English: "change the vibe", "make it more playful", "make it more business-like", "adjust the theme", "change primary color".

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

goodpatch/sparkle-design172026년 10월 19일 업데이트

WCAG 準拠のアクセシビリティチェックをチェックリスト駆動で実行するスキル。 コンポーネント・ページ・PR に対して Pass/Fail/N/A/Needs review の構造化レポートを 生成し、エビデンスと修正案を提示する。 「アクセシビリティチェック」「a11y チェック」「WCAG をチェック」「a11y レビュー」 「アクセシビリティ監査」「WCAG 準拠確認」「アクセシビリティレポート」への言及、 または PR やコンポーネントのアクセシビリティレビュー依頼で発動する。 English: "check accessibility", "a11y audit", "a11y check", "WCAG review", "accessibility report", "screen reader test", "review for a11y", "review this PR for accessibility", "axe audit"

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

goodpatch/sparkle-design172026년 10월 19일 업데이트

Generate comprehensive test plans, manual test cases, regression test suites, and bug reports for QA engineers. Includes Figma MCP integration for design validation.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

manu14357/zskills162026년 7월 24일 업데이트

Automatically organize invoices and receipts for tax preparation by extracting key information, renaming files consistently, and sorting into logical folders. Transform chaotic bookkeeping into tax-ready records.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

manu14357/zskills162026년 7월 24일 업데이트

Guides the practical path from 'we have no design system' or 'we have a mess' to a real, functional design system. Component inventory, design token extraction, headless UI adoption (Radix, React Aria, Headless UI), migration order of operations, and the assessment-to-rollout pipeline. Activate on 'design system from scratch', 'bootstrap design system', 'no design system', 'design system migration', 'headless UI adoption', 'component audit', 'design token extraction', 'design system strategy'. NOT for building specific components once a system exists (use design-system-creator), not for generating token files/configs (use design-system-generator).

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

curiositech/windags-skills162026년 10월 19일 업데이트

wireframe

무료

Generate JSON wireframe with HTML preview

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

yhassy/wireframe-skill162026년 10월 6일 업데이트

Structured multi-file implementation plans before build; scope-aware, enforces Gate 1. NOT for ticket sizing (mk:planning-engine) or plan CEO-review (mk:plan-ceo-review).

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

ngocsangyem/MeowKit152026년 7월 28일 업데이트

mk-stitch

무료

Generate novel UI from a text prompt via Stitch AI; exports Tailwind/HTML + DESIGN.md for mk:frontend-design handoff. NOT implementing existing designs -- use mk:figma or mk:frontend-design.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

ngocsangyem/MeowKit152026년 7월 28일 업데이트

Use when designing UI components, reviewing visual design, building design systems, or checking accessibility. Auto-activates on frontend design tasks and UI reviews.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

ngocsangyem/MeowKit152026년 7월 28일 업데이트

mk-figma

무료

Read-first Figma gateway via Figma MCP: analyze designs, implement 1-3 screens, extract tokens, produce Evidence Packet. Advanced ops gated on explicit intent. Use for 'figma', 'design tokens'.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

ngocsangyem/MeowKit152026년 7월 28일 업데이트

mk-intake

무료

Ticket/PRD intake: product-area classification, completeness scoring, RCA, technical assessment. Works with Jira, Linear, GitHub, or manual paste. Use to analyze or triage a ticket.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

ngocsangyem/MeowKit152026년 7월 28일 업데이트

mk:stitch

무료

Generate novel UI from a text prompt via Stitch AI. Exports Tailwind/HTML, produces DESIGN.md for mk:frontend-design handoff. NOT for implementing existing designs — use mk:figma or mk:frontend-design for that.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

ngocsangyem/MeowKit152026년 7월 28일 업데이트

Creates structured multi-file implementation plans before build. Scope-aware: trivial tasks exit early, simple tasks get fast plans, complex tasks get full research + phase files + validation. Enforces Gate 1. Activated by /mk:plan or /mk:cook. NOT for ticket complexity analysis against an existing codebase (see mk:planning-engine); NOT for CEO-level scope review of existing plans (see mk:plan-ceo-review).

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

ngocsangyem/MeowKit152026년 7월 28일 업데이트

mk:figma

무료

Read-first Figma gateway via Figma MCP: analyze designs, implement Figma-to-code for 1–3 screens, extract design tokens, produce a Figma Evidence Packet for planning handoff, screenshot fallback. Advanced operations (Code Connect, canvas writes, design-system/library patterns) are gated references loaded only on explicit intent. Triggers: 'figma', 'design link', 'implement this design', 'design tokens', 'produce a Figma Evidence Packet'.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

ngocsangyem/MeowKit152026년 7월 28일 업데이트

mk:intake

무료

Ticket/PRD intake: product area classification, completeness scoring, RCA, technical assessment. Works with Jira (via mk:jira-issue / jira-as), Linear (via MCP), GitHub (via gh CLI), or manual paste. Triggers: 'analyze ticket', 'intake PRD', 'triage issue', 'classify ticket', 'check ticket'.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

ngocsangyem/MeowKit152026년 7월 28일 업데이트

Use when designing UI components, reviewing visual design, building design systems, or checking accessibility. Auto-activates on frontend design tasks and UI reviews.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

ngocsangyem/MeowKit152026년 7월 28일 업데이트

Claude Code CLIでGitHub PRのコードレビューループを回す。PRのURLを指定し、Claude Codeにレビューさせ、指摘をトリアージしてコードを修正し、再レビューする。PRにリンクされたIssue等は必読として機械的に検証する。

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

keitakn/engineering-skills152026년 10월 8일 업데이트

Codex CLIでGitHub PRのコードレビューループを回す。PRのURLを指定し、Codexにレビューさせ、指摘をトリアージしてコードを修正し、再レビューする。PRにリンクされたIssue等は必読として機械的に検証する。

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

keitakn/engineering-skills152026년 10월 8일 업데이트

An infographic skill for AI agents — works inside Claude Code, Codex, Hermes, OpenClaw, Cursor, and any agent host that loads skills. Create professional infographics as self-contained HTML files with PNG exports. Use when the user asks to create, design, generate, build, or make an infographic, data visualization, visual explainer, chart poster, cheatsheet, or pocket guide. Trigger phrases include "make this visual", "turn this into a graphic", "visualize this data", "infographic for X", "cheatsheet for X", or when the user provides structured data (tokenomics allocations, ecosystem/partner lists, timelines, comparisons, step-by-step processes) AND asks for a visual output. Covers tokenomics, ecosystem overviews, game overviews, cheatsheets, airdrop guides, comparisons, and process flows. Do NOT trigger for plain text answers, markdown tables, bulleted summaries, questions asking for advice or explanations about a topic (even when the topic is tokenomics, ecosystem, vesting, etc.), inline chat diagrams, or data processing with no visual output requested. The signal is "asks for a visual", not "mentions a keyword".

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

aizzaku/aiz-infographic142026년 5월 25일 업데이트

54 real design systems (Stripe, Linear, Vercel) as HTML/CSS.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

kevinnft/ai-agent-skills142026년 8월 1일 업데이트

Use BEFORE writing or editing any non-trivial UI — inventories components, design tokens, shadcn primitives, and reusable patterns into state.ui_audit. Hard gate for fe-design.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

event4u-app/agent-config122026년 10월 20일 업데이트

analyse

무료

Conception pipeline. Détecte le mode (epic/task/bug) selon le type d'issue ou le prompt et invoque les agents appropriés. Usage: /analyse [<issue#>] [<description>]

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

SocialGouv/egapro122026년 10월 20일 업데이트