design-elevate
github.com/avanderheyde/design-elevate- Category
- AI Agents
- Rank
- No. 2197Tools index
Previous survey · No. 2167 ·
- Pricing
- Open Source
- Type
- AGENT
- Builder
- @Alderik_
- Date
About
An agent skill that gives a functional but generic-looking web app a distinct visual identity. It starts from a token-first DESIGN.md, runs a mockup board approval loop before touching code, then applies per-page passes covering type, layout, color, motion and polish, auditing the result against a list of AI-design anti-patterns. It is explicitly an aggregator: it orchestrates and credits existing external design skills and references rather than generating an aesthetic of its own.
What it does
It guides an agent through a staged redesign process for existing web apps. The process diagnoses generic visual patterns, gathers product context, compares several working HTML directions, records approved design rules, then applies typography, layout, color, motion, polish, and quality checks page by page.
Why it's ranked here
The method is unusually concrete for a design prompt: approval happens before application code changes, design decisions become a shared contract, and each page passes through ordered gates. Its value comes from disciplined orchestration and curation, not a new design engine. Results still depend on the agent, companion skills, browser tooling, and user feedback.
What's good
It separates identity decisions from implementation, which reduces expensive redesign churn. Real HTML mockups preserve typography and realistic content better than image concepts. Named color slots prevent accent sprawl, while a decisions log limits later drift. The page pipeline also joins visual craft with loading states, accessibility-minded motion constraints, performance budgets, and explicit rejection of recurring generic patterns.
Tradeoffs
This is a prescriptive workflow, not an automated reskinner or component library. It asks for several mockups, screenshots, feedback rounds, foundation work, and repeated page gates. The repository also describes itself as an aggregator, so much of its reach comes from external skills and reference sources. It degrades without them, but the documented pipeline works best with the recommended set installed.
How to use it well
Use it when an existing web product works but lacks a defensible visual system, and when stakeholders can approve directions before implementation. Give the agent clear users, brand traits, references, anti-references, and realistic page content. Keep the approved rules authoritative during page migration. Do not choose it for inventing a reusable component library, replacing product strategy, or producing a quick one-shot cosmetic pass.
Technical notes+
SKILL.md is a Markdown Agent Skill with YAML frontmatter and the orchestration procedure. It defines diagnosis, design-contract creation, a three-to-four-variant HTML approval loop, a foundation-first migration, eleven ordered per-page passes, research-source routing, anti-pattern checks, motion constraints, and performance budgets. README.md documents installation through the skills package command or direct copying into an agent skills directory, plus optional companion skills. LICENSE applies MIT terms to the skill text while noting that referenced external works retain their own licenses and terms. The supplied SKILL.md content is truncated, so later sections cannot be assessed here.
Observed
- License
- MIT for the skill text; referenced external works retain their own licenses and terms.
- Implementation format
- Markdown Agent Skill with YAML frontmatter.
- Install surface
- Install through the skills package command or copy the skill Markdown into an agent skills directory.
- Interface
- Agent Skill consumed by a compatible coding agent; no standalone application interface is described.
- Core structure
- Aggregator that orchestrates credited external design skills, references, and writing.
- Workflow structure
- Uses three to four HTML design variants, approval before application changes, then ordered per-page passes.
Read from README.md, LICENSE, SKILL.md.
Tags
Comments (0)
No comments yet
Editorially curated, with community endorsements as a secondary signal. Corrections welcome.