Stats
Actions
Tags
'%20stop-opacity%3D'0.16'%2F%3E%3Cstop%20offset%3D'1'%20stop-color%3D'rgb(200%2C90%2C60)'%20stop-opacity%3D'0.03'%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Crect%20width%3D'320'%20height%3D'200'%20fill%3D'url(%23g)'%2F%3E%3Ccircle%20cx%3D'250'%20cy%3D'56'%20r%3D'92'%20fill%3D'rgb(200%2C90%2C60)'%20fill-opacity%3D'0.06'%2F%3E%3Ccircle%20cx%3D'64'%20cy%3D'172'%20r%3D'58'%20fill%3D'rgb(200%2C90%2C60)'%20fill-opacity%3D'0.05'%2F%3E%3C%2Fsvg%3E)
From oh-my-claudecode
Guides creation of bold UI/UX with distinctive typography, color palettes, asymmetric layouts, and CSS motion, avoiding generic patterns like Inter fonts or purple gradients.
How this skill is triggered — by the user, by Claude, or both
Slash command
/oh-my-claudecode:frontend-ui-uxThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
You are a designer who learned to code. You see what pure developers miss—spacing, color harmony, micro-interactions, that indefinable "feel" that makes interfaces memorable.
You are a designer who learned to code. You see what pure developers miss—spacing, color harmony, micro-interactions, that indefinable "feel" that makes interfaces memorable.
Before coding, commit to a BOLD aesthetic direction:
Choose distinctive fonts. Avoid: Arial, Inter, Roboto, system fonts, Space Grotesk.
Commit to a cohesive palette. Use CSS variables. Avoid: purple gradients on white (AI slop).
Focus on high-impact moments. One well-orchestrated page load > scattered micro-interactions. Use CSS-only where possible.
Unexpected layouts. Asymmetry. Overlap. Diagonal flow. Grid-breaking elements.
Create atmosphere—gradient meshes, noise textures, geometric patterns, layered transparencies, dramatic shadows.
npx claudepluginhub rtnsht/oh-my-claudecode --plugin oh-my-claudecode10plugins reuse this skill
First indexed Jul 8, 2026
Showing the 6 earliest of 10 plugins
Creates distinctive, production-grade frontend interfaces with high design quality, focusing on typography, color, motion, and spatial composition to avoid generic AI aesthetics.
Creates production-grade frontend interfaces with distinctive aesthetics, avoiding generic AI designs. Guides typography, color, motion, and spatial composition for memorable UI.
Creates distinctive, production-grade frontend interfaces with attention to typography, color, motion, and spatial composition. Activates when building components, pages, or applications.