← All skills

frontend-design-guidelines

65 / 100 · Review before installing

Check before installing.

By Sarthib7/agentsmith (GitHub) · design · 10 stars · scanned at commit ce32b25

Apply high-quality web interface design rules when building, reviewing, or styling frontend code. Use when the user says "build a frontend", "create a component", "style this", "review my UI", "build a landing page", "design this page", "make this look good", "add animation", "build a form", "improve the UI", "polish this", "make this feel right", "review for craft", "the interaction feels off", "make this look polished", or when generating any React/Next.js component. Defaults to Tailwind CSS …

Works with any agent that supports SKILL.md skills.

What this skill can do

Safer alternatives

Low-risk skills in the same category (design) that look related. Check that one does what you need.

• 100 Low riskfrontend-designmastra-ai/mastra · 29,480 stars
• 100 Low riskopenakita/skills@frontend-designopenakita/openakita · 2,017 stars
• 95 Low riskanthropic-frontend-designdavekilleen/Dex · 514 stars

Install

Paste this into your terminal. It downloads exactly the version we scanned, not whatever is newest.

if [ -e ~/.agents/skills/'frontend-design-guidelines' ] || [ -L ~/.agents/skills/'frontend-design-guidelines' ]; then echo 'A skill folder named frontend-design-guidelines already exists — not replacing it' >&2; false; else d=$(mktemp -d) && git clone --quiet --filter=blob:none --no-checkout 'https://github.com/Sarthib7/agentsmith' "$d" && git -C "$d" checkout --quiet 'ce32b25868ce2b233d6a15caef60170d5bf7abc8' -- 'skills/frontend-design-guidelines' && mkdir -p ~/.agents/skills && cp -R "$d"/'skills/frontend-design-guidelines' ~/.agents/skills/'frontend-design-guidelines' && rm -rf "$d"; fi

Codex reads ~/.agents/skills directly. For Claude Code, Cursor, Copilot, Gemini CLI, Antigravity or OpenCode, also link it. For Claude Code: ln -s ~/.agents/skills/'frontend-design-guidelines' ~/.claude/skills/'frontend-design-guidelines' (other agents: ~/.cursor/skills, ~/.copilot/skills, ~/.gemini/skills, ~/.gemini/config/skills, ~/.config/opencode/skills). Or install through the finder skill, which does both.

Badge for your README

The badge for Sarthib7/agentsmith shows the score of its lowest-scoring skill.

[![SkillTrust](https://zalavijaysinh.github.io/skilltrust/badges/Sarthib7/agentsmith.svg)](https://zalavijaysinh.github.io/skilltrust/repos/Sarthib7/agentsmith/)

Score history