design-philosophy Skill
The VS Code design philosophy — a shared Values→Principles→Moves vocabulary for reasoning about UI in design terms instead of raw pixels. Use when designing, building, reviewing, or giving feedback on any visual surface; when deciding a radius, spacing, type role, icon size, border, color, or motion; or when translatin Published by microsoft in vscode.
What is design-philosophy Skill?
The VS Code design philosophy — a shared Values→Principles→Moves vocabulary for reasoning about UI in design terms instead of raw pixels. Use when designing, building, reviewing, or giving feedback on any visual surface; when deciding a radius, spacing, type role, icon size, border, color, or motion; or when translatin Published by microsoft in vscode. This profile combines repository metadata with install, compatibility, and usage signals so developers can quickly decide whether it fits their agent workflow before opening the source repository.
Automated repository signals based on public metadata such as recency, license, installation evidence, and adoption. These are not a security audit or endorsement.
Key capabilities
- Includes SKILL.md support
- Reusable instructions support
- Design and media
- Design and media use cases
Technical details
- Install or run with Copy skill directory
When to use design-philosophy Skill
- Use it for design and media.
Built with
Editorial notes
Source
- Creator: microsoft
- Repository: microsoft/vscode
- Skill file: .github/skills/design-philosophy/SKILL.md
What it does
The VS Code design philosophy — a shared Values→Principles→Moves vocabulary for reasoning about UI in design terms instead of raw pixels. Use when designing, building, reviewing, or giving feedback on any visual surface; when deciding a radius, spacing, type role, icon size, border, color, or motion; or when translatin
Skill instructions
VS Code Design Philosophy This skill is the canonical VS Code design philosophy — the single source of truth for how we reason about UI, for both developers and agents. As more and more of the UI is implemented via agents and tooling, the pixels increasingly take care of themselves, and the scarce, human part becomes the design judgment behind them. This is about shifting left - talking about UI in design terms, not pixels, and having that conversation early. When something looks off, "this is 8px, should be 6px" fixes one number; "this surface is rounded at the wrong elevation tier" names the rule, so the fix lands everywhere and we catch it on a mockup or screenshot rather than in code review. The aim is to agree on what the UI should be and why, in language a designer and an engineer can share - the implementation (which token, which file) tends to follow once the design is settled. --- How to read this: three layers The hardest part of any design language is getting from "this feel
Explore related resources
Frequently asked questions
What is design-philosophy?
design-philosophy is a open-source AI agent skill with Copy skill directory. The VS Code design philosophy — a shared Values→Principles→Moves vocabulary for reasoning about UI in design terms instead of raw pixels.
Who is design-philosophy best for?
design-philosophy is best for reusing agent instructions, scripts, and references, design and media workflows.
How do I install design-philosophy?
Install or run design-philosophy using Copy skill directory. Check design-philosophy for the latest setup command.
Is design-philosophy actively maintained?
design-philosophy may need a closer maintenance check before production use.
Auto-fetched from GitHub.
