claudeers.
// Claude Skills

sv-academy-prom-design

Ready-to-use design taste for Claude Code, Cowork, and Cursor. Prom = Thai for ready. Learn free at loop.sv-academy.org

// Claude Skills[ cli ][ api ][ web ][ mobile ][ claude ]#claude#agent-skills#anti-slop#claude-code#cursor#design#design-system#landing-page#skills◷ MIT$open-sourceupdated about 1 month ago
Actively maintained
100/100
last commit about 1 month ago
last release about 1 month ago
releases 1
open issues 0
// star history

Install with your AI

Paste into Claude Code, Cursor, or any agent — it reads the repo and wires the tool into your project.

Install and set up sv-academy-prom-design (claude-plugin project) into my current project.
Found on https://claudeers.com/sv-academy-prom-design
Repo: https://github.com/sva-admin/sv-academy-prom-design
Homepage/docs: https://loop.sv-academy.org
Detected install method: claude-plugin → /plugin install sv-academy-prom-design@sva-admin/sv-academy-prom-design
Category: skills. Platforms: cli, api, web, mobile.
Read the repo's README for exact setup and env vars, then install it and wire it into my project.

Claudeers Health Verdict:
active; community-verified: false. Confirm the source before running anything.
// or install directly (claude-plugin)
/plugin marketplace add sva-admin/sv-academy-prom-design
/plugin install sv-academy-prom-design@sva-admin/sv-academy-prom-design
// or clone
git clone https://github.com/sva-admin/sv-academy-prom-design

// compatibility

Platformscli, api, web, mobile
Operating systems—
AI compatibilityclaude
LicenseMIT
Pricingopen-source
LanguageJavaScript

Get your FREE $2.50 API credits to access TickAtlas financial data ↗

SV Academy

Prom Design. Ready-to-use design taste for AI coding agents.

Your AI ships pages that look expensive. Starting today.

พร้อม, prom, is Thai for ready. Ready as in: the taste is already in the file. This is the house-style skill a working studio runs on real client sites, installable by anyone in one command. It asks what you are making, offers you the Prom take, and builds mobile-first. You never need to know design; you only need to recognize which version you like.


The 50 millisecond problem

People form a verdict on your page in about 50 milliseconds, and they rarely revise it (Lindgaard et al., 2006). When Stanford's Web Credibility Project asked 2,684 people why they did or did not trust a site, the look of the design was the single most cited reason, present in 46.1% of their comments, ahead of information structure at 28.5% (Fogg et al., 2002). Your product gets judged before anyone reads a word of it. Both figures, and the widely repeated 75% misquote of the second one, are sourced in CITATIONS.md.

AI coding agents make this worse, because they all default to the same look: the purple gradient, the emoji card grid, the rounded pill button, copy that promises everything and proves nothing. Everyone can see it now. It has a name: AI slop.

Same brand. Same one-line request. One difference: the skill.

WithoutWith Prom Design
sv-academy-prom-designsv-academy-prom-design
The purple gradient specialTinted ground, one serif, proof over promise

Install once

The universal way, verified on 19+ agents including Claude Code and Cursor:

npx skills add sva-admin/sv-academy-prom-design

Or as a Claude Code plugin:

claude plugin marketplace add sva-admin/sv-academy-prom-design
claude plugin install prom-design@sv-academy-prom-design

Claude Cowork: zip skills/prom-design/ and upload it as a skill.

Never installed a skill before? GETTING-STARTED.md walks you from zero to your first page in five minutes. And every demo below is a real page you can open live: sva-admin.github.io/sv-academy-prom-design

Then run it on YOUR page

Do not take the gallery's word for it. The only demo that matters is your own project:

Apply the prom-design skill to this page. Show me before and after, and name
every rule you applied.

The diff is the sales pitch. If you do not like what you see, uninstall it, nothing else changed.

Walk through a whole product, not a screenshot

The strongest proof is clickable. Two complete fictional experiences, every page built by the skill and holding at any width:

What it does to real work

Every "without" below is a look you have shipped or seen shipped. Every "with" is the SAME site transformed: same sections, same facts, same purpose, redesigned by the skill. That is the honest test, and it is also exactly what the skill does to your existing pages. Nothing here is a mockup of a real client; all brands are invented so the rules can be shown at full specificity.

A restaurant. The emoji card grid, versus a room you can almost smell.

WithoutWith Prom Design
sv-academy-prom-designsv-academy-prom-design
"The BEST dining experience in town!!!"Eight chairs, one seating, doors 18:40 sharp

A SaaS dashboard. The same five invoices twice: the admin-panel special, versus an instrument you could run a business on.

WithoutWith Prom Design
sv-academy-prom-designsv-academy-prom-design
Alert banners, Verdana, Delete links412,900 collected, 2 due this week, tabular numerals

A portfolio. The my-first-website special, versus a page that costs what your work costs.

WithoutWith Prom Design
sv-academy-prom-designsv-academy-prom-design
Centered Times, blue links, crammed gridOne photograph, one serif, 214 frames kept of 41,800

A florist in a rainy hill town. The same shop twice, section for section: three services, the weekly jar at 340 a month, the testimonial, the hours. Hot-pink template slop versus the same flowers taken seriously.

WithoutWith Prom Design
sv-academy-prom-designsv-academy-prom-design
Dancing Script, emoji, star marqueeRain-glass green, evidence, one quoted subscriber

A mobile web app. Link soup, versus seats you can count.

sv-academy-prom-design

And the pattern library itself, live. Every signature component rendered and interactive, from the proof strip to the coach overlay: components.html

Why one opinionated style, not a toolkit

Because choice is exactly what a non-designer does not need. Fifty palettes and a hundred font pairings are homework; one proven aesthetic is a result. The skill carries two registers and the agent picks by task, so your only decision is recognizing which page you are making:

RegisterForFeels like
CinematicLanding pages, brands, portfoliosFull-bleed photography, editorial serif, an argument you scroll
InstrumentApps, dashboards, booking flowsDense, quiet, tabular, everything provable at a glance

The style is opinionated, your content is not: your brand's colors, imagery, and copy all flow through the same rules, which is why the four demos above share a spine and still look like four different businesses.

What is actually in the box

Engineering, not vibes. 12 files, ~2,600 lines of working rules:

FileWhat it enforces
SKILL.mdThe thesis, both registers, and the working loop: brief, contract, build, review gate, audit, ship
references/taste.mdWhat the style always does, never does, and the expensive lessons behind each rule
references/tokens.md + assets/tokens-starter.cssTwo shipped token systems, drop-in ready
references/patterns.mdSignature components with the measurements that make them work
references/copy.mdProof-over-promise copywriting: evidence beside every claim
references/imagery.mdReal photography rules: specific place, season, hour, honest labels
references/webapp.mdThe mobile playbook: density budget, bottom tab bar, compaction
references/audit.mdThe multi-lens audit that rejects slop before a client sees it
scripts/shots.mjsReview gate: every route, three widths, screenshots plus defect metrics
scripts/design-audit.mjsGenerates a six-agent design audit tuned to your repo

Objections, answered honestly

"Will everything I make look the same?" Less than now. Every default agent output already converges on one look, and it is the bad one. Two registers plus your own brand tokens diverge far more than the purple gradient ever will. The four demos above are the proof.

"My MVP does not need design." Your MVP needs trust, and the look of the design is the first thing people reach for when they explain why they trust a site or do not. A page that looks cheap makes the product underneath it look cheap. That is the whole reason this skill exists.

"I cannot judge design." You do not have to generate taste, only recognize it. You just did, four times, in the gallery above.

"What is the catch?" It is one deliberate aesthetic. If you want an agent to invent a fresh visual identity from a blank page, use a different skill. If you want to stop shipping slop today, this is the one.

Who made this

Built by Prom at SV Academy, distilled from the house style a working studio uses on real client sites (the clients stay private; the fictional brands here carry their lessons). SV Academy teaches people to build real things with AI, free, at loop.sv-academy.org.

If the skill saved your page from the purple gradient, star the repo so the next person finds it, and send the before/after to one friend who ships slop. More open skills: github.com/sva-admin.

MIT licensed. All example brands are fictional. Landscape and interior photographs in the demos are Unsplash stock, labelled "demonstration imagery" on the page itself, exactly as the skill's own honesty rules require.

// faq

What is sv-academy-prom-design?

Ready-to-use design taste for Claude Code, Cowork, and Cursor. Prom = Thai for ready. Learn free at loop.sv-academy.org. It is open-source on GitHub.

Is sv-academy-prom-design free to use?

sv-academy-prom-design is open-source under the MIT license, so it is free to use.

What category does sv-academy-prom-design belong to?

sv-academy-prom-design is listed under skills in the Claudeers registry of Claude-compatible tools.

4 views
★ 28 stars
unclaimed
updated about 1 month ago

// embed badge

sv-academy-prom-design on Claudeers
[![Claudeers](https://claudeers.com/api/badge/sv-academy-prom-design.svg)](https://claudeers.com/sv-academy-prom-design)

// retro hit counter

sv-academy-prom-design hit counter
[![Hits](https://claudeers.com/api/counter/sv-academy-prom-design.svg)](https://claudeers.com/sv-academy-prom-design)

// reviews

// guestbook

0/500

// related in Claude Skills

🔓

An agentic skills framework & software development methodology that works.

// skillsobra/⟨Shell⟩★ 292,190◷ MIT[ claude ]
🔓

Public repository for Agent Skills

// skillsanthropics/⟨Python⟩★ 178,324[ claude ]
🔓

💫 Toolkit to help you get started with Spec-Driven Development

// skillsgithub/⟨Python⟩★ 138,919◷ MIT[ claude ]
🔓

AI coding assistant skill (Claude Code, Codex, OpenCode, Cursor, Gemini CLI, and more). Turn any folder of code, SQL schemas, R scripts, shell scripts, docs,…

// skillsGraphify-Labs/⟨Python⟩★ 123,800◷ MIT[ claude ]
→ see how sv-academy-prom-design connects across the ecosystem