Agent skill

Prototype - Tailwind CSS Design

General tailwind tailwind css responsive web design UI design utility first components dashboard frontend responsive design
Create clean, responsive interfaces using Tailwind CSS utilities and modern design patterns.
Use directly in editor
MCP tool render_whiteboard · Output type General
How to use

Set up the skill in three steps.

Connect the MockFlow Boards MCP server to your AI assistant, add the skill file, then ask for what you need.

Input examples Copy
Describe the Tailwind interface you want to design...
1

Connect MCP server

Add MockFlow Boards MCP to your AI assistant:

Desktop MCP
Web MCP
Loginless MCP
claude mcp add --transport http -s user mockflow-ideaboard http://localhost:21193/mcp
Requires the MockFlow Desktop app running locally
npm install -g @mockflow/ideaboard-mcp && mockflow-ideaboard-mcp login && mockflow-ideaboard-mcp
Install the CLI, log in with your MockFlow account, then start the server
claude mcp add --transport http -s user mockflow-ideaboard https://app.mockflow.com/ideaboard/mcp
No account needed, free to use
2

Install the skill

Download the SKILL.md file and place it in your skills directory:

~/.claude/skills/mockflow-prototype-tailwind-css-design-1/SKILL.md
3

Use the skill

Claude Code will auto-detect when your prompt matches the skill. You can also invoke it directly with /mockflow-prototype-tailwind-css-design-1.

Get started

Connect your agent to MockFlow.

Set up MCPAll agent skills
More to explore