Frontend & UI
Skeuomorphic UI
Give buttons and panels tactile depth with layered gradients and shadows.
What it is
A surface recipe for tactile web UI: vertical gradient fills, a 1px reflective gradient border, stacked outer and inset shadows. Embossed text, icons, and micro texture are optional.
Create skeuomorphic web UI surfaces with layered gradients, stacked inner and outer shadows, reflective gradient borders, micro texture, and embossed text or icon details. Use when asked for pressed, carved, tactile, rea
Why it matters for design
- Raised and pressed states reverse depth, so controls read as physical.
- Depth stays directional, with light from top and shadow below.
- Warns against mixing glassmorphism, neumorphism, and skeuomorphism in one component.
What it covers
- Use when
- Surface recipe
- Raised surface
- Pressed surface
- Embossed text and icons
- Micro texture
How to install
Skeuomorphic UI
-
Clone the repo.
git clone https://github.com/MengTo/Skills -
Point Codex at the skill file.
agent-skills/web-design/skeuomorphic-ui/SKILL.md -
Then describe the UI you want. Codex follows the skill.
How to run it with Codex
-
Set the base tokens once, then tune them per brand and theme.
-
Apply the raised surface to cards, buttons, tabs, and control housings.
-
Add the pressed variant for active toggles and selected tabs only.
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.