Flat
Flat is an agent skill (a SKILL.md file) from bergside/awesome-design-skills. Two-dimensional minimalist style with vibrant colors, clean typography, and no 3D effects for fast, user-friendly interfaces. It works with Claude Code, Codex and Cursor and has 3,348 GitHub stars across a repository of 3 listed skills.
github.com/bergside/awesome-design-skills/skills/flat (opens in a new tab)
Data as of from the GitHub API; description from the skill's SKILL.md. Report an error
- Multi-skill repo
- Design & frontend
- Maintained
Add this skill
Claude
Claude Code loads skills from ~/.claude/skills/ (all projects) or .claude/skills/ (one project):
git clone --depth 1 https://github.com/bergside/awesome-design-skills.git
cp -r awesome-design-skills/skills/flat ~/.claude/skills/flat # personal, or .claude/skills in a projectIn the Claude apps, zip the flat folder and upload it under Customize > Skills > + > Upload a skill (code execution must be on).
ChatGPT / Codex
Codex reads skills from .agents/skills/ in a repo or ~/.agents/skills/ for every project:
git clone --depth 1 https://github.com/bergside/awesome-design-skills.git
cp -r awesome-design-skills/skills/flat .agents/skills/flat # repo; ~/.agents/skills for all projectsStandalone skills also load in the ChatGPT desktop app.
Cursor
Cursor loads skills from .cursor/skills/ (or ~/.cursor/skills/) and also reads .claude/skills/:
git clone --depth 1 https://github.com/bergside/awesome-design-skills.git
cp -r awesome-design-skills/skills/flat .cursor/skills/flat # project; ~/.cursor/skills for all projectsSource (checked Oct 7, 2026): code.claude.com/docs/en/skills (opens in a new tab), support.claude.com/en/articles/12512180-using-skills-in-claude (opens in a new tab), learn.chatgpt.com/docs/build-skills (opens in a new tab), cursor.com/docs/context/skills (opens in a new tab)
What this skill does
Two-dimensional minimalist style with vibrant colors, clean typography, and no 3D effects for fast, user-friendly interfaces. You are an expert design-system guideline author for Flat. Create practical, implementation-ready guidance that can be directly used by engineers and designers.
More skills in bergside/awesome-design-skills
3 skills are listed from this repository.
Similar skills
More design & frontend skills
Fa Route Generator
fantastic-admin/basic
管理 Vue Router 路由配置,用于 Fantastic-admin 框架。当用户提到以下任何需求时必须使用此技能:新建页面需要加路由、详情页不想显示在菜单里、新增页和编辑页老是开两个标签、从列表跳详情返回后状态丢失、给菜单项加 NEW 标签或红点、路由需要权限控制、配置页面保活、修改路由 meta、添加面包屑配置。即使用户只是说"加个路由"或"新建了一个页面",也应触发此技能。.
Active · last commit Oct 22, 2026
Design & frontendVueBindcraft
FreedomIntelligence/OpenClaw-Medical-Skills
End-to-end binder design using BindCraft hallucination.
Maintained · last commit Jul 21, 2026
Design & frontendPythonJourney Map
Owl-Listener/designer-skills
Map one persona's end-to-end experience with stages, touchpoints, emotions, and pain points.
Maintained · last commit Sep 5, 2026
Design & frontendMarkdownDirecting Stickman Videos
kaomei/stickman-video-director
Turn topics, requirements, articles or scripts into stickman videos.
Too new to judge · created Aug 3, 2026
Design & frontendPythonCreate Adaptable Composable
vuejs-ai/skills
Create a library-grade Vue composable that accepts maybe-reactive inputs (MaybeRef / MaybeRefOrGetter) so callers can pass a plain value, ref, or getter.
Maintained · last commit Oct 23, 2026
Design & frontendAppllama App Design Skill
Appllama/appllama-skills
Build native-feeling, benchmark-quality mobile app screens (Expo / React Native).
Too new to judge · created Aug 13, 2026
OfficialDesign & frontend
How do I install the Flat skill?
Copy the flat folder (the one containing SKILL.md) into ~/.claude/skills/ for Claude Code, .agents/skills/ for Codex or .cursor/skills/ for Cursor. The agent picks it up automatically when a task matches its description.
Is the Flat skill free?
Yes. The repository is open source under the MIT license.
Is Flat maintained?
The repository's most recent commit was on Jun 28, 2026. appsgit only lists skills from repositories with a commit in the last six months.