← All skills

Image to code

Elite website image-to-code skill for Codex.

Install

npx degit Leonxlnx/taste-skill/skills/image-to-code-skill .claude/skills/image-to-code

Run it in your project root, then ask your agent for what you want. More detail

What it built

A page built by the Image to code design skill
A page this skill built when we ran it. Your result will differ with your brief.

What it does

Elite website image-to-code skill for Codex. For visually important web tasks, it must first generate the design image(s) itself, deeply analyze them, then implement the website to match them as closely as possible. In Codex, it must prefer large, readable, section-specific images instead of tiny compressed boards, generate fresh standalone images for sections or detail views instead of cropping old ones, avoid lazy under-generation, avoid cards-inside-cards-inside-cards UI, and keep the hero clean, spacious, readable, and visible on a small laptop.

Straight from the skill's own SKILL.md. This is what your agent reads.