Manavarya09

Grade — Design skill for Claude Code

Design community

Generate a shareable HTML "Design Report Card" — letter grade, 8 dimensions, evidence (palette, type, rhythm), strengths + fixes, plus an SVG badge.

How to install Grade

Installs to ~/.claude/skills/manavarya09-design-extract-grade/SKILL.md

Terminal

mkdir -p ~/.claude/skills/manavarya09-design-extract-grade && curl -fsSL https://raw.githubusercontent.com/Manavarya09/design-extract/HEAD/commands/grade.md -o ~/.claude/skills/manavarya09-design-extract-grade/SKILL.md

Restart Claude Code, or start a new session, for it to be picked up.

What Grade does

description: Generate a shareable HTML "Design Report Card" — letter grade, 8 dimensions, evidence (palette, type, rhythm), strengths + fixes, plus an SVG badge. argument-hint: [--badge] [--open]

Audit the design system at the user-provided URL. Emits a self-contained HTML report card plus JSON + Markdown variants. Pass `--badge` to also emit a shields.io-style SVG you can drop into any README.

npx designlang grade $ARGUMENTS

If no `$ARGUMENTS` were supplied, ask the

Alternatives in Design

Frontend Design — Create distinctive, production-grade frontend interfaces with high design quality 94.1k ★
Export Diagram — Export a diagram-design HTML file to .svg and .png next to the source 27.2k ★
Weather Orchestrator Command — Fetch the current temperature for Dubai, UAE and create a visual SVG weather card 20.2k ★