octopus-ui-ux-design

Featured

Design UI/UX systems with style guides, palettes, typography, and component specs for new interfaces

Web & Frontend 4,099 stars 385 forks Updated today MIT

Install

View on GitHub

Quality Score: 99/100

Stars 20%
100
Recency 20%
100
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
50
License 10%
100
Description 5%
100

Skill Content

## EXECUTION CONTRACT (MANDATORY - CANNOT SKIP) <HARD-GATE> **CRITICAL: You MUST call the BM25 search engine (search.py) via Bash tool before producing any design recommendations. Do NOT rely solely on your own design knowledge. The search engine provides curated, data-driven design intelligence. If you produce a design system without at least 3 search.py calls, you have violated this contract.** </HARD-GATE> This skill uses **ENFORCED execution mode**. You MUST follow this exact sequence. ### STEP 1: Interactive Questions (BLOCKING) **You MUST call AskUserQuestion before any other action.** ```javascript AskUserQuestion({ questions: [ { question: "What type of product are you designing for?", header: "Product Type", multiSelect: false, options: [ {label: "SaaS/Dashboard", description: "Analytics, admin panels, B2B tools"}, {label: "E-commerce", description: "Shopping, marketplace, product pages"}, {label: "Landing page", description: "Marketing, conversion, product launch"}, {label: "Mobile app", description: "iOS/Android native or responsive"} ] }, { question: "What tech stack are you using?", header: "Stack", multiSelect: false, options: [ {label: "React + Tailwind (Recommended)", description: "React/Next.js with Tailwind CSS"}, {label: "React + shadcn/ui", description: "React with shadcn component library"}, {label: "HTML + Tailwind", descriptio...

Details

Author
nyldn
Repository
nyldn/claude-octopus
Created
8 months ago
Last Updated
today
Language
Shell
License
MIT

Integrates with

Bundled in these plugins

Similar Skills

Semantically similar based on skill content — not just same category

Web & Frontend Listed

aio-uiux

Web UI design and review advisor — applies UX psychology, interaction patterns, WCAG accessibility, and modern CSS to design new interfaces or critique existing ones. Use proactively when reviewing any frontend UI, scaffolding new components, or deciding layout/color/typography trade-offs.

4 Updated 1 weeks ago
aiocean
Web & Frontend Listed

ui-ux-pro-max

UI/UX design intelligence with searchable database

1 Updated yesterday
chingleel17
Web & Frontend Listed

ui-ux-designer

UI/UX Designer for Solaris - design systems (tokens / theming / component architecture), responsive web design (breakpoints / container queries / mobile-first), mobile design (iOS HIG / Material 3 / native navigation), React Native design (Reanimated, Tailwind RN, navigation patterns), web component design (compound components, polymorphic, headless UI, slot composition), accessibility (WCAG 2.1 AA, ARIA patterns, screen reader, reduced motion, high contrast), Figma-to-code workflows (Style Dictionary token pipeline, CSS custom properties, multi-platform output), variant + size systems (CVA / class-variance-authority), dark mode + multi-brand theming, design token hierarchy (primitive → semantic → component), UX research synthesis, microinteractions, motion design, design QA + handoff. Use when the owner says "UI design", "UX design", "design system", "design tokens", "Figma", "Style Dictionary", "theme switching", "dark mode", "component library", "design handoff", "WCAG", "accessibility", "ARIA", ".

1 Updated today
Shaisolaris