How do I install the Baseline UI skill?

Run npx skillmds@latest add podo/baseline-ui in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

What does the Baseline UI skill do?

Validates animation durations, enforces typography scale, checks component accessibility, and prevents layout anti-patterns in Tailwind CSS. Ensures UI work meets baseline quality standards before shipping. It is listed under Design & Media on SkillMD.

Is Baseline UI safe to use?

This skill has not completed SkillMD's automated safety review yet. Independent scanners report: SkillSpector: PASS, Skill Scanner: PASS. Capability flags: makes network calls. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Baseline UI?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Baseline UI free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Baseline UI?

podo (@podo) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Baseline UI by podo — Agent Skill

Name: Baseline UI
Rating: 4.5 (4 reviews)
Author: podo

File contents

baseline-ui

Catalogue stub — full skill: ibelick/ui-skills

Decision tree

Run this before any baseline UI validation work:

Is the full skill already installed? Check: ~/.design-agent-skills/skills/baseline-ui/SKILL.md exists AND does NOT contain a das: block.
- Yes → invoke baseline-ui and proceed
- No → go to step 2
Do you have shell access?
- Yes → run the install command below, then invoke the skill
- No → show the install command; in Claude Code, send it as a chat message starting with ! — add -g for global install or omit for project-only

Install command

npx skills add ibelick/ui-skills --skill baseline-ui

Or per-agent:

Claude Code: claude skills add ibelick/ui-skills
Cursor/OpenCode: npx skills add ibelick/ui-skills --skill baseline-ui

Invoke after install

Skill name: baseline-ui
Trigger phrases: "baseline UI", "animation validation", "typography scale", "Tailwind anti-patterns"

What it does

Validates animation durations against design system standards, enforces typography scale consistency, and checks component accessibility. Prevents common layout anti-patterns in Tailwind CSS to keep UI output consistent and production-ready.

Frequently asked questions

Baseline UI