Frontend & UI
UI-UX Pro Max · UI Styling
Builds accessible interfaces with shadcn components and Tailwind utilities.
What it is
Combines a shadcn component layer on Radix primitives, a Tailwind utility styling layer, and a canvas visual design layer. Includes reference files for theming, accessibility, responsive rules and customization.
Create beautiful, accessible user interfaces with shadcn/ui components (built on Radix UI + Tailwind), Tailwind CSS utility-first styling, and canvas-based visual designs. Use when building user interfaces, implementing
Why it matters for design
- Dialogs and menus inherit Radix focus management, so accessibility is not retrofitted.
- Theme colours live in CSS variables, so dark mode stays consistent.
- Mobile-first breakpoints mean layouts start small and layer upward.
What it covers
- Core stack
- Component library guide
- Theme and customization
- Accessibility patterns
- Responsive design
- Visual design system
How to install
UI-UX Pro Max · UI Styling
-
Clone the repo.
git clone https://github.com/nextlevelbuilder/ui-ux-pro-max-skill -
Point Codex at the skill file.
cli/assets/skills/ui-styling/SKILL.md -
Then describe the UI you want. Codex follows the skill.
How to run it with Codex
-
Run npx shadcn@latest init to configure the framework and theme.
-
Add components with npx shadcn@latest add button card dialog form.
-
Run scripts/tailwind_config_gen.py to generate a config with custom tokens.
Every plugin here is free, open source, and links to its real upstream source.
More on the codex-design list ↗More Codex design plugins
Frontend & UI What it does gpt-taste Builds award-style landing pages with GSAP scroll motion and gapless bento grids. 
Design Systems What it does Stitch Design Taste Writes a DESIGN.md that steers Google Stitch toward non-generic screens. 
Frontend & UI What it does image-to-code Generates design images first, analyzes them, then builds matching frontend code. 
Frontend & UI What it does imagegen-frontend-mobile Generates premium mobile app screen flows as images, not code. Next step
Design with Open Design, without the setup
Install this plugin yourself, or run a whole curated design layer around Codex with Open Design. Bring your own key, own your output.