Frontend & UI
imagegen-frontend-web
Generates one horizontal reference image per landing page section.
What it is
An image-direction skill for website design references. It generates one separate horizontal image per section, with a single locked palette and varied hero composition across the set.
Elite frontend image-direction skill for generating premium, conversion-aware website design references. CRITICAL OUTPUT RULE — generate ONE separate horizontal image FOR EVERY section. A landing page with 8 sections pro
Why it matters for design
- An eight-section landing page yields eight readable comps, not one compressed board.
- Hero composition varies past the overused left text, right image default.
- One palette, type scale, and CTA family holds across every generated frame.
What it covers
- Image count and page slicing
- The combinatorial variation engine
- Hero minimalism rules
- Color and material rules
- Multi-image consistency rule
- Default site packs
How to install
imagegen-frontend-web
-
Clone the repo.
git clone https://github.com/Leonxlnx/taste-skill -
Point Codex at the skill file.
skills/imagegen-frontend-web/SKILL.md -
Then describe the UI you want. Codex follows the skill.
How to run it with Codex
-
Say how many sections you want; unstated landing pages default to six.
-
The skill announces the count, then labels each output by section number.
-
Give vibe words like editorial or cinematic to steer hero scale and background.
Every plugin here is free, open source, and links to its real upstream source.
More on the codex-design list ↗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.