foundry-nextgen-frontend
✓Build elegant frontend UIs following Microsoft Foundry's NextGen Design System using Vite + React + pnpm + Framer Motion. Use when creating dashboards, agent builders, data grids, entity management interfaces, or any application matching Foundry's refined dark-themed aesthetic.
Installation
SKILL.md
Build elegant, production-ready interfaces following Microsoft Foundry's NextGen Design System - a refined neutral dark-themed design language with minimal purple accents and subtle animations.
| Page content | 32px (--space-8) | | Card | 20px (--space-5) | | Card header | 16px 20px | | Button | 8px 16px | | Input | 10px 12px | | Table cell | 12px 16px | | Modal body | 24px | | Badge/Tag | 4px 10px |
| Card grid | 16px (--space-4) | | Form fields | 20px (--space-5) | | Button group | 12px (--space-3) | | Tag group | 8px (--space-2) |
Build elegant frontend UIs following Microsoft Foundry's NextGen Design System using Vite + React + pnpm + Framer Motion. Use when creating dashboards, agent builders, data grids, entity management interfaces, or any application matching Foundry's refined dark-themed aesthetic. Source: microsoft/agent-skills.
Facts (cite-ready)
Stable fields and commands for AI/search citations.
- Install command
npx skills add https://github.com/microsoft/agent-skills --skill foundry-nextgen-frontend- Source
- microsoft/agent-skills
- Category
- </>Dev Tools
- Verified
- ✓
- First Seen
- 2026-02-01
- Updated
- 2026-02-18
Quick answers
What is foundry-nextgen-frontend?
Build elegant frontend UIs following Microsoft Foundry's NextGen Design System using Vite + React + pnpm + Framer Motion. Use when creating dashboards, agent builders, data grids, entity management interfaces, or any application matching Foundry's refined dark-themed aesthetic. Source: microsoft/agent-skills.
How do I install foundry-nextgen-frontend?
Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.) Copy and run this command: npx skills add https://github.com/microsoft/agent-skills --skill foundry-nextgen-frontend Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code or Cursor
Where is the source repository?
https://github.com/microsoft/agent-skills
Details
- Category
- </>Dev Tools
- Source
- skills.sh
- First Seen
- 2026-02-01