Skills tagged "design" (787)

📝 Architecture

This skill helps you document architecture and high-level system design, emphasizing interfaces, data flows, and decision rationale.

docsdesignplanning

🛡️ Architecture Decision Framework

This skill guides architecture decisions using ADRs, trade-offs, and C4 diagrams to produce actionable patterns and documentation for complex systems.

designbackendapicloud

📋 Architecture Decision Record

This skill helps you create ADR templates and maintain architectural memory using the Nygard format for decisions, context, consequences, and alternatives.

backenddocsmigrationdesign

🔍 Architecture Guardian

This skill helps enforce clean architecture principles, layering rules, and boundary management to improve module decoupling and interface design.

designrefactorcode-reviewplanning

🧪 Arktype

This skill helps you design robust discriminated unions in TypeScript using arktype's merge and or patterns for scalable commands and events.

typescriptdatadesignrefactor

✨ Article Batch Illustration

This skill analyzes a Markdown article, generates per-paragraph illustration prompts, batches image creation via Gemini API, and inserts images into Obsidian.

aiautomationdesigncontent

⚙️ Aseprite Frame Extract

This skill exports per-tag frames from Aseprite files into organized folders for engines like Godot, accelerating asset management.

pythonautomationscriptingcli

🛡️ Assesment

This skill guides autonomous risk assessment during design and planning, prompting deep reasoning to uncover root causes before implementation.

automationdesignsecurity

🛡️ Assess

This skill evaluates code, designs, or approaches with a structured 0-10 score, pros/cons, and practical improvement recommendations.

code-reviewtestingsecurityperformance

⚙️ Asset Generator

This skill generates complete app asset sets icons splash screens adaptive icons for iOS Android and Web from a single design config.

designuxbrandingcli

🎨 Atomic Design Fundamentals

This skill describes Atomic Design fundamentals, quarks, atoms, molecules, organisms, templates, pages and how to structure scalable design systems.

frontenddesignuxreact

🧪 Authoring Claude Md

This skill helps create and maintain CLAUDE.md project memories by capturing non-obvious conventions, patterns, and gotchas beyond code inspection.

aidocswritingpython

🧪 Axiom Swiftui 26 Ref

This skill guides implementing iOS 26 SwiftUI features, enabling Liquid Glass, AttributedString, WebView, Animatable, drag and drop, and visionOS integration.

swiftperformancedesignfrontend

🛡️ Backend Design

This skill enforces elite backend discipline by organizing by business capability, validating edge cases, and documenting failure modes for resilient APIs.

backendapisecurityperformance

🛡️ Backend Developer

This skill helps design robust, secure, and scalable backend systems across Node, Python, Go, and Java with architecture and API best practices.

backendapisecurityperformance

📋 Baoyu Infographic

This skill generates publication-ready infographics by analyzing content and recommending layout and style combinations from 20 layouts and 17 styles.

designdataanalyticspython

📋 Baoyu Infographic

This skill generates publication-ready infographics by analyzing content and recommending optimal layout and style combinations across 20 layouts and 17 styles.

designdatamarketingcontent

📋 Baoyu Xhs Images

This skill generates Xiaohongshu infographic series in multiple styles and layouts, turning content into 1-10 cartoon infographics for easy sharing.

designcontentsocial-mediaai

📋 Baoyu Xhs Images

This skill generates Xiaohongshu infographic series with 9 visual styles and 6 layouts, breaking content into engaging 1-10 image sequences.

designsocial-mediacontentmarketing

🎨 Billing Sdk

This skill helps you integrate BillingSDK quickly by guiding you through React components, CLI setup, and Dodo Payments configuration.

frontendapicliux

📝 Bkit Templates

This skill helps you generate PDCA documents with consistent structure using Plan, Design, Analysis, and Report templates.

docswritingplanningai

⚙️ Blockbench Hytale

This skill helps you create Hytale models and animations in Blockbench using the MCP plugin, enforcing constraints and export-ready setups.

automationscriptingdesigndocs

⚙️ Blockbench Texturing

This skill helps you create and texture 3D models in Blockbench using MCP tools for painting, layering, and UV mapping.

designuxautomationdocs

⚙️ Booking Calendar

This skill designs frictionless booking experiences that maximize appointment completions by simplifying forms, clarifying expectations, and ensuring instant

designuxmarketingautomation

📋 Brainstorm

This skill guides you through structured brainstorming to explore options, analyze trade-offs, and converge on a clear implementation plan.

aiplanningproductdesign

📋 Brainstorming

This skill helps convert rough ideas into actionable designs through phased questioning and collaborative exploration before detailing implementation.

designplanningproductux

⚙️ Brainstorming

This skill guides rough ideas into structured designs through collaborative dialogue, exploring options and validating incrementally.

designplanningproductux

📋 Brainstorming

This skill helps transform rough ideas into fully formed designs through collaborative questioning, multiple approaches, and incremental validation before

designplanningproductresearch

🎨 Brainstorming

This skill enables collaborative ideation before implementation, offering multiple options, trade-offs, and strategy to shape features, components, and

planningproductdesignfrontend

📝 Brand Guidelines

This skill helps you craft user-facing copy that follows Sentry brand guidelines across UI, errors, onboarding, and documentation.

brandingcopywritinguxdesign

📝 Brand Guidelines

This skill applies Mastra brand guidelines to documentation and code by enforcing technical writing style, typography, and visual formatting for consistency.

docswritingdesigncontent

⚙️ Brand Identity Template

This skill provides a single source of truth for brand guidelines, design tokens, voice, and tech choices to ensure consistent UI and copy.

brandingdesigncopywritingdocs

📋 Brand Style

This skill helps designers and developers apply Screenpipe brand guidelines to UI, copy, and visuals while preserving privacy and consistency.

brandingdesignuxcopywriting

📋 Brand Voice Generator

This skill creates complete brand configuration files and voice guidelines to accelerate brand setup for presentations and content creation.

brandingdesignwritingcontent

🐛 Bubbletea

This skill helps you build stylish terminal UIs in Go with Bubbletea, delivering reliable layouts, interactions, and production-ready templates.

backendclidebuggingproductivity

📋 Business Analyst

This skill helps you uncover user needs and define a clear product brief through structured discovery, stakeholder interviews, and market research.

productresearchplanninganalytics

📋 C3

This skill audits C3 architecture docs for consistency and validity, routing to query, provision, or onboard as needed.

docsdesigncliproductivity

🔍 C3 Alter

This skill guides architectural changes through ADR-first workflows, analyzing intent, synthesizing proposals, and executing staged plans with automated

automationdesignplanningdocs

📝 C3 Provision

This skill documents architecture before code, creating an ADR and provisioned component docs to guide design without implementation.

docsplanningdesignstrategy

🔍 C3 Query

This skill navigates C3 architecture docs and code to answer questions about how components and containers interact.

docsdesigncode-reviewtypescript

🎨 Canva Dev

This skill helps you develop Canva Apps SDK projects by guiding you through documentation, UI kit usage, CLI commands, and design reviews.

clidocsdesignfrontend

🎨 Canvas

This skill helps you create spatial node diagrams with precise coordinates using JSON canvas format for mind maps, graphs, and planning boards.

planningdesignproductivityux

🎨 Canvas Design Skill

This skill generates HTML5 Canvas templates with pre-defined drawing logic for shapes like rectangles, circles, grids, and stars.

frontenddesignscriptingdebugging

📋 Canvas Design Skill

This skill creates original, publication-ready visual designs in PNG or PDF by applying color theory, typography, and composition principles.

designaccessibilityproductcontent

🎨 Carbon Icons

This skill ensures React components use Carbon Icons from @carbon/icons-react with proper sizing, color, alignment, and accessibility.

reactfrontenddesignux

📋 Card News Generator

This skill generates a 5-7 card Instagram-style card news series with topic input, colors, and optional background images, handling text wrapping.

social-mediadesigncontentbranding

🔍 Cdd Design Pillars

This skill helps review and design Jakarta EE/MicroProfile code for cognitive load, guiding when to extract abstractions and enforce boundaries.

designcode-reviewproductivityperformance

🧪 Clean Architecture

This skill helps you implement Clean Architecture, Hexagonal Architecture and DDD in PHP/Symfony, ensuring testable, framework-agnostic domain logic.

phpbackendtestingrefactor

🎨 Code Connect Components

This skill connects Figma design components to code implementations by locating matches and creating Code Connect mappings across your project.

frontendautomationdesignproductivity

🎨 Codify Dev Skill

This skill converts design into business-ready UI code by accurately reproducing visuals and generating structured, data-driven components.

frontendcode-reviewdesignux

🧪 Coding Styleguide

This skill helps you apply balanced coding patterns and best practices to improve maintainability, scalability, and code quality across projects.

designrefactorcode-reviewtesting

📋 Cognitive Fallacies Guard

This skill helps detect and prevent visual misleads, cognitive biases, and data integrity issues in visualizations and reports.

dataanalyticsdesignux

🧪 Color Accessibility

This skill helps you design accessible color palettes and contrast checks to ensure color-blind friendly visuals across interfaces and charts.

accessibilitydesignuxfrontend

🎨 Color Palette

This skill generates complete, accessible color palettes from a brand hex, including 11-shade scales, semantic tokens, dark mode, and WCAG checks.

brandingdesignaccessibilityfrontend

🎨 Color System

This skill helps you design accessible, themed color systems with harmony, dark mode support, and color-blind friendly palettes across brands.

designuxaccessibilitybranding

🎨 Component Library

This skill generates production-ready React components with shadcn/ui patterns and CVA variants to save 8-10 hours per project.

frontenduxaccessibilitydesign

🎨 Components Build

This skill helps you design, review, and refactor React UI components with accessibility, composition, and TypeScript APIs following the components.build

frontendaccessibilitydesignrefactor

🎨 Composition Patterns

This skill helps you refactor React components by applying scalable composition patterns to reduce boolean props and clarify APIs.

frontendrefactorcode-reviewdesign

🎨 Composition Patterns

This skill guides refactoring with composition patterns to replace boolean props, enabling scalable, reusable React APIs and architecture.

frontendrefactorcode-reviewdesign

🧪 Concurrent Safe Animation

This skill helps implement concurrency-safe animations that resist re-entrancy and interrupted updates, ensuring glitch-free rendering and stable layouts.

frontendperformancetestingdebugging