Web Design Engineer skill: what it does and how to install it
Builds polished browser-rendered pages, dashboards, prototypes, animations and visualisations with HTML, CSS, JavaScript and React.
Summary generated from the skill's documentation.
Install
$ npx skills add ConardLi/garden-skills --skill web-design-engineerRun it in a terminal. If your agent is already running, start a new session so it picks the skill up.
About this skill
What it does. Establishes a design direction and system before coding, then creates a viewable v0 for feedback before completing the HTML, CSS, JavaScript or React build. It supports responsive layouts, interaction, motion, branded assets, design critique and explicit browser acceptance testing.
When to use it. For visual front-end artefacts, redesigns, prototypes, slide decks, dashboards, UI mockups and data visualisations. It does not cover back-end APIs, CLI tools, data-processing scripts, long-form article conversion or narration-driven video presentations.
History
Repo stars
12.8k
Tracking since . A chart appears once there are 7 days of data.
Installs
8k
Tracking since . A chart appears once there are 7 days of data.
Installs via skills.sh
Similar skills
- Huashu DesignCreates high-fidelity HTML prototypes, slide decks, animations and visualisations through three visual directions and an approval-led design workflow.
- Taste SkillSteers an agent away from templated-looking frontends: it reads the brief, picks a design direction and builds landing pages and redesigns.
- Brand LandingpageCreates brand-led landing pages with Stitch, from visual-direction interview through iterative browser review and deployment-ready HTML.