Image to Code
leonxlnx
Draws the page as artwork first, one legible frame per band of the page, studies what it drew, then writes the frontend to match. The picture is a step in the middle rather than the deliverable, which is what separates it from the image-only skills next to it.
Skills it gets confused with
These share a family with Image to Code, which is another way of saying they are the ones you might reach for by mistake.
- Design Taste FrontendBuilds the persuasion surface of a website - a launch page, a personal or studio portfolio, a visual overhaul of a site that already exists - and ships the working page, steered hard away from the templated look a model reaches for by default: a stated aesthetic read of the brief, a committed type and colour language, and motion that has to justify itself. Its scope stops at surfaces meant to be scrolled and read; dashboards, data grids, and multi-step wizards are handed off to a product-UI system rather than restyled.
- Design Taste Frontend V1The superseded edition of the same frontend skill, kept installable so a project tuned against its exact rules does not shift underneath when the current one changes them. Nothing about its subject differs. Only its vintage does.
- Frontend DesignDeciding how a UI should look and feel before you build it: typography, colour, hierarchy, and escaping the default templated appearance.
- Gpt TasteThe same push away from templated pages, aimed at Codex and GPT because they drift differently: it forces a fresh pick of hero shape, type stack and scroll choreography each build instead of reaching for last time's, and leans hard on scroll-driven motion. What separates it from the general version is the model it corrects, not the work it covers.
- High End Visual DesignSpends its rules on the feel of expensive: how far a card lifts, how light falls across it, how long an easing runs, how much room a section is given. It varies the composition every time by design, and the things it bans are the ones that read as cheap, like blunt shadows and motion that snaps.
- Industrial Brutalist UiCommits a build to one hard-edged look: exposed structure, sizes that jump from tiny to enormous, colour used only to warn, and print or CRT artefacts faked in software. Pick it when the interface should read as machinery rather than a product, and when packing the screen is the point.
Knowing what Image to Code does is the easy half. Telling it apart from the others under time pressure is the game.
Today's sessionImage to Code is part of leonxlnx/taste-skill. Licence: MIT. The description above was written for this game, not taken from the skill.