By tonone-ai
Design and manage semantic color palettes with dark/light mode tokens and WCAG AA contrast compliance. Audit existing codebases for hardcoded colors, missing tokens, and contrast failures to enforce design consistency.
Design a color palette with semantic tokens for a brand or product.
Audit existing color usage in a codebase — find inconsistencies, hardcoded values, and contrast failures.
Audit or refactor a design token system for color — naming, structure, and coverage.
Uses power tools
Uses Bash, Write, or Edit tools
Based on adoption, maintenance, documentation, and repository signals. Not a security audit or endorsement.
npx claudepluginhub tonone-ai/tonone --plugin hueDesign a color palette with semantic tokens for a brand or product
UI/UX design intelligence. 107 styles, 127 palettes, 107 font pairings, 106 charts, 131 reasoning rules, 129 UX guidelines, 16 stacks (React, Next.js, Vue, Nuxt.js, Svelte, Astro, Angular, Remix, SolidJS, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, Jetpack Compose, Nuxt UI). 8 Python scripts: BM25 search, contrast checker, palette generator, token generator, type scale calculator, design system generator, UI auditor, CLI. Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, liquid glass, cyberpunk, spatial UI, data brutalism. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient, design tokens, contrast checker.
Use this agent when creating user interfaces, designing components, building design systems, or improving visual aesthetics. This agent specializes in creating beautiful, functional interfaces that can be implemented quickly within 6-day sprints. Examples:\n\n<example>\nContext: Starting a new app or feature design
Craft polished user interfaces with layout grids, color systems, typography scales, responsive patterns, and visual hierarchy.
Ultra-compressed communication mode. Cuts 65% of output tokens (measured) while keeping full technical accuracy by speaking like a caveman.
Multi-model consensus engine integrating OpenAI Codex CLI, Gemini CLI, and Claude CLI for collaborative code review and problem-solving.
Design and build networking infrastructure — VPCs, subnets, DNS, load balancers, firewall rules. Use when asked to "set up networking", "VPC design", "configure DNS", "load balancer setup", "network architecture", or "firewall rules".
Generate onboarding documentation — what this project does, how to set up locally, where things live, key decisions, how to deploy. Written for day-one engineers who know nothing. Use when asked for "onboarding docs", "new engineer guide", "how to get started", or "developer setup".
Implement a reusable, accessible, typed component from a design spec. Use when asked to "create a component", "build a widget", "implement this design", or "reusable UI element".
Verify observability posture — audit monitoring coverage, find blind spots, prioritize gaps. Use when asked "is monitoring sufficient", "observability review", "are we covered", or "pre-launch monitoring check".
ML reconnaissance — inventory all models, pipelines, data sources, and monitoring. Use when asked "what ML do we have", "model inventory", or "ML assessment".