AkaraChen/aghub

Adapt adapts existing designs to work across screen sizes, devices, and input methods. Use it when you need breakpoints, fluid layouts, touch-friendly interactions, or platform-specific layout changes.

Animate reviews a feature and adds purposeful motion, micro-interactions, and transitions that improve feedback and usability. Use it when you want animations, hover effects, or other motion design in a UI, with reduced-motion support kept in mind.

Arrange improves layout, spacing, and visual hierarchy when a UI feels crowded, monotonous, or structurally weak. Use it to fix alignment, grid repetition, and rhythm issues.

Audit runs technical quality checks for accessibility, performance, theming, responsive behavior, and anti-patterns. Use it when you need a scored implementation review with P0-P3 findings and an action plan.

Bolder amplifies safe or generic designs with stronger typography, color, spacing, and composition while keeping them usable. Use it when a design feels bland, lacks personality, or needs more visual impact.

Clarify improves unclear interface copy, error messages, labels, and instructions so users can understand what to do next. Use it when text is confusing, too vague, or not matched to the user’s situation.

Colorize adds strategic color to interfaces that feel gray, dull, or visually flat. Use it to introduce brand-aligned accents, semantic states, and warmer surfaces without overwhelming the design.

Critique evaluates a design from a UX perspective, covering hierarchy, information architecture, cognitive load, emotional response, and usability. Use it when you need structured feedback on an interface, component, or screen.

Delight adds moments of joy, personality, and polish to interfaces through micro-interactions, success states, empty states, and playful copy. Use it when you want an experience to feel more memorable without hurting usability.

Distill removes unnecessary complexity from a design so the essential elements stand out. Use it when a UI feels cluttered, noisy, or too feature-heavy and needs a simpler hierarchy.

Extract identifies reusable UI patterns, components, and design tokens, then consolidates them into a design system. Use it when refactoring repeated UI, creating shared components, or adding tokens for consistency.

Form Patterns guides building and refactoring forms in aghub desktop app code. Use it for HeroUI v3 forms, react-hook-form integration, validation, custom editors, and error presentation.

Frontend Design creates distinctive, production-grade interfaces and code for pages, components, posters, and apps. Use it when you need polished frontend work with strong visual direction and a context-driven design process.

Harden strengthens interfaces against long text, RTL and i18n issues, loading and error states, and edge cases. Use it when making a UI production-ready with better validation, overflow handling, and graceful recovery.

HeroUI React helps you build React UIs with HeroUI v3 components such as Buttons, Modals, Forms, and Cards. Use it when installing @heroui/react, applying Tailwind CSS v4, or setting up dark and light themes.

Improve surveys a codebase and writes prioritized, self-contained implementation plans for another agent to execute. It is read-only on source code and is used for audits, bug triage, roadmap planning, and handoff plans.

Init Deep generates a hierarchical AGENTS.md knowledge base and paired CLAUDE.md files for a codebase. Use it to initialize or refresh project documentation at the root and in relevant subdirectories.

Normalize audits and realigns UI to match design system standards, spacing, tokens, and patterns. Use it when a feature has design drift, inconsistent styles, or needs to be brought back in line with the system.

Onboarding designs first-run experiences, empty states, and guided flows that help users reach value quickly. Use it for activation, getting started, and new user journeys.

Overdrive pushes interfaces past conventional limits with shaders, spring physics, scroll-driven reveals, and high-performance animations. Use it when a UI should feel extraordinary, especially for landing pages, interactions, or data-heavy views.

Performance Optimization diagnoses and fixes UI performance issues across loading speed, rendering, animations, images, and bundle size. Use it when a user reports slow, laggy, or janky interfaces or wants a faster experience.

Polish performs a final quality pass to fix alignment, spacing, consistency, and other small issues before shipping. Use it when a UI is functionally complete but still feels off or needs pre-launch review.

Quieter tones down visually aggressive or overstimulating designs while preserving usability and character. Use it when a interface feels too bold, loud, or overwhelming and needs a calmer, more refined look.

Teach Impeccable gathers design context for a project and saves it to a persistent AI config file. Use it once to establish design guidelines for future sessions and optionally sync them to Copilot instructions.

Typeset improves typography by fixing font choice, hierarchy, sizing, weight, and spacing so text reads clearly and feels intentional. Use it when fonts, readability, or text hierarchy look off or need polishing.