UI Components
Code-based UI component generation and styling
emergency-card
by huifer
生成紧急情况下快速访问的医疗信息摘要卡片。当用户需要旅行、就诊准备、紧急情况或询问"紧急信息"、"医疗卡片"、"急救信息"时使用此技能。提取关键信息（过敏、用药、急症、植入物），支持多格式输出（JSON、文本、二维码），用于急救或快速就医。
goal-analyzer
by huifer
分析健康目标数据、识别目标模式、评估目标进度,并提供个性化目标管理建议。支持与营养、运动、睡眠等健康数据的关联分析。
agent-builder
by shareAI-lab
Design and build AI agents for any domain. Use when users: (1) ask to "create an agent", "build an assistant", or "design an AI system" (2) want to understand agent architecture, agentic patterns, or autonomous AI (3) need help with capabilities, subagents, planning, or skill mechanisms (4) ask about Claude Code, Cursor, or similar agent internals (5) want to build agents for business, research, creative, or operational tasks Keywords: agent, assistant, autonomous, workflow, tool use, multi-step, orchestration
backend-dev-suite
by Leavesfly
后端开发综合技能包（Java 编码 + 数据库设计 + 安全加固）
charted-design
by marmicode
Interviews the user section by section to collaboratively produce design documents. Use when creating a design doc, starting feature design, or when the user invokes the design command.
charted-scaffold
by marmicode
Writes work-in-progress code and tests based on design doc
charted-green
by marmicode
Progressively activates todo tests one at a time, updates implementation code until each passes (verified via Wallaby), then moves to the next—following the design doc as the single source of truth.
charted-review
by marmicode
Reviews a design doc with expert sub-agents
billing-sdk
by dodopayments
Guide for using BillingSDK - open-source React components for pricing tables, subscription management, and billing UI with Dodo Payments.
mermaid
by i9wa4
Mermaid diagram creation and debugging for Quarto revealjs slides. Use when creating or editing mermaid diagrams (sequenceDiagram, flowchart, pie, etc.) embedded in .qmd files, previewing with mmdc, or fixing text color issues in revealjs output. Covers %%{init}%% config, CSS overrides, and sequenceDiagram tips.
termcast
by remorses
Build TUIs with a Raycast-like React API using termcast. Implements @raycast/api components (List, Detail, Form, Action) rendered to the terminal via opentui.
design-system-architecture
by NickCrew
Build scalable design systems with design tokens, component APIs, and documentation. Use when creating or evolving component libraries.
family-health-analyzer
by huifer
分析家族病史、评估遗传风险、识别家庭健康模式、提供个性化预防建议
ai-analyzer
by huifer
AI驱动的综合健康分析系统，整合多维度健康数据、识别异常模式、预测健康风险、提供个性化建议。支持智能问答和AI健康报告生成。
skeuomorphic-ui
by vibheksoni
Build dark skeuomorphic UI components (knobs, sliders, inset controls, raised shells) with top-lighting, layered shadows, tactile depth, and animation-ready interaction patterns. Trigger this skill when the user asks for skeuomorphic components, neumorphic dark controls, rotary dials, or realistic hardware-like UI.
goal-analyzer
by huifer
分析健康目标数据、识别目标模式、评估目标进度,并提供个性化目标管理建议。支持与营养、运动、睡眠等健康数据的关联分析。
mental-health-analyzer
by huifer
分析心理健康数据、识别心理模式、评估心理健康状况、提供个性化心理健康建议。支持与睡眠、运动、营养等其他健康数据的关联分析。
animejs
by BowTiedSwan
Comprehensive skill for Anime.js v4 - a fast and flexible JavaScript animation library. This skill should be used when implementing web animations, creating timelines, working with SVG animations, scroll-based animations, draggable elements, staggered effects, or any JavaScript-based animation on the web. Triggers on: "anime.js", "animejs", "animate elements", "CSS animation with JS", "timeline animation", "stagger animation", "SVG morphing", "motion path", "scroll animation", "draggable", "spring animation", "keyframe animation".
landing-page-guide-v2
by bear2u
Create distinctive, high-converting landing pages that combine proven conversion elements with exceptional design quality. Build beautiful, memorable landing pages using Next.js 14+ and ShadCN UI that avoid generic AI aesthetics while following the 11 essential elements framework.
nats-design-subject
by TrogonStack
Design NATS subject hierarchies for messaging patterns (pub/sub, request/reply, streaming). Apply naming conventions, segmentation strategies, and wildcard patterns to create scalable subject architectures. Use when designing NATS messaging systems, planning multi-tenant communication, or auditing existing subject hierarchies. Do not use for: (1) NATS server configuration or cluster setup, (2) client library implementation or connection code, (3) debugging connectivity or performance issues, (4) choosing between NATS and other messaging systems.
creating-streamlit-themes
by streamlit
Creating and customizing Streamlit themes. Use when changing app colors, fonts, or appearance, or aligning apps to brand guidelines. Covers config.toml configuration, design principles, and CSS avoidance.
using-streamlit-markdown
by streamlit
Covers all Markdown features in Streamlit including GitHub-flavored syntax plus Streamlit extensions like colored text, badges, Material icons, and LaTeX. Use when formatting text, labels, tooltips, or any text-rendering element.
building-streamlit-custom-components-v2
by streamlit
Builds bidirectional Streamlit Custom Components v2 (CCv2) using st.components.v2.component. Use when authoring inline HTML/CSS/JS components or packaged components (manifest asset_dir, js/css globs), wiring state/trigger callbacks, theming via --st-* CSS variables, or bundling with Vite / component-template v2.
organizing-streamlit-code
by streamlit
Organizing Streamlit code for maintainability. Use when structuring apps with separate modules and utilities. Covers separation of concerns, keeping UI code clean, and import patterns.