Official Mobile

penpot-uiux-design

Comprehensive guide for creating professional UI/UX designs in Penpot using MCP tools. Use this skill when: (1) Creating new UI/UX designs for web, mobile, or desktop applications, (2) Building design systems with components and tokens, (3) Designing dashboards, forms, navigation, or landing pages, (4) Applying accessibility standards and best practices, (5) Following platform guidelines (iOS, Android, Material Design), (6) Reviewing or improving existing Penpot designs for usability. Trigger...

This skill ships only metadata — no inline instructions. See the source repo for details.

Install this skill

One command (all agents)

Runs the npx skills CLI which auto-detects every AI coding agent you have installed (Claude Code, Cursor, Codex, OpenCode, Windsurf, Copilot, and 51 more).

npx skills add https://github.com/github/awesome-copilot/tree/HEAD/skills/penpot-uiux-design

Alternative: shorthand form

npx skills add github/awesome-copilot --skill penpot-uiux-design

Install to a specific agent

Pick the agent you use. The CLI writes the skill to that agent's standard skill directory.

npx skills add github/awesome-copilot --skill penpot-uiux-design --agent claude-code

npx skills add github/awesome-copilot --skill penpot-uiux-design --agent cursor

npx skills add github/awesome-copilot --skill penpot-uiux-design --agent codex

npx skills add github/awesome-copilot --skill penpot-uiux-design --agent opencode

npx skills add github/awesome-copilot --skill penpot-uiux-design --agent github-copilot

npx skills add github/awesome-copilot --skill penpot-uiux-design --agent windsurf

Manual install (no CLI)

Prefer to skip the CLI? Clone the repo and drop the skill folder into your agent's skills directory.

git clone https://github.com/github/awesome-copilot.git

cp -r awesome-copilot/skills/penpot-uiux-design ~/.claude/skills/

For other agents, replace ~/.claude/skills/ with their skill directory — see the full list.

Use it

Once installed, ask your agent to "use the penpot-uiux-design skill" or describe what you want (e.g. "Comprehensive guide for creating professional UI/UX designs in Penpot using MCP"). Most agents auto-discover the skill from its SKILL.md description — no slash command needed.

Requires: Node.js 18+ for npx skills. Skill files are MIT-style permissive by default — check the source repo for the actual license.

SKILL.md source

---
name: penpot-uiux-design
description: Comprehensive guide for creating professional UI/UX designs in Penpot using MCP tools. Use this skill when: (1) Creating new UI/UX designs for web, mobile, or desktop applications, (2) Building design
---

Related skills 6

vercel-react-native-skills

★ Featured Official

React Native and Expo best practices for building performant mobile apps. Use when building React Native components, optimizing list performance, implementing animations, or working with native modules. Triggers on tasks involving React Native, Expo, mobile performance, or native platform APIs.

vercel-labs 124k

Mobile

adapt

★ Featured

Adapt designs to work across different screen sizes, devices, contexts, or platforms. Implements breakpoints, fluid layouts, and touch targets. Use when the user mentions responsive design, mobile layouts, breakpoints, viewport adaptation, or cross-device compatibility.

pbakaus 82k

Mobile