Ant (Awesome Design Skills)
3/5 out of 5. Read the verdictA structured, enterprise design system focused on clarity and consistency for data-dense web apps. From bergside's Awesome Design Skills.
First screen only. Switch to side by side to read the full pages.
Scroll either page; the other follows.Full Ant (Awesome Design Skills) pageFull baseline
Every skill gets the same Tally brief, alone in a clean project. How we test
Our verdict
3/5 out of 5
Passed the cut
Ant gives Tally the look of Ant Design: white and cool grey, a #1677ff blue, Plus Jakarta Sans with JetBrains Mono figures, and compact bordered cards and tags. The landing hero is a realistic budget dashboard; the dashboard itself is dense and tidy. It is clean and clearly not the default, but it looks like many admin tools. Pick it for data-heavy B2B apps.
Pick it for
- B2B and admin apps
- data-dense dashboards
- internal tools
- enterprise SaaS
Skip it for
- consumer brands that need personality
- editorial or luxury sites
- playful products
Typography
Colors
Observations
- landing: reads more like an admin screen than a marketing page
Install
1 Run in your terminal
npx degit bergside/awesome-design-skills/skills/ant#main .claude/skills/ant2 Or paste a prompt into Claude Code, Codex, Cursor or Gemini
It tells your tool to install this from its source repository.
This install is for Claude Code only; for other agents use Copy prompt or copy the skill folder.
Copies just this skill's folder into your project's .claude/skills.
Check the source for the latest instructions.
We tested the ant skill from this repo.
Details
- Type
- Skill
- GitHub stars
- 3,255*
- Updated
- 4mo ago
- License
- MIT
- Best for
- Visual directionDashboards
Test runOpus 5.5Claude Code 2.1.303Oct 19, 2026generated in 6 minabout $1.42 at API pricescommit f631a09
* Stars are for the whole bergside/awesome-design-skills repository.
Made this skill?Put your score on your README, and claim this page for a link to your site. 
1. Put your score on your README
[](https://skillsfordesign.com/s/awesome-design-skills-ant/) The badge links here. If a retest changes the score, it updates by itself.
2. Claim this page
Get a free backlink to your site.
- A followed link, not nofollow. From the page about your skill, on a site about design skills, to your portfolio, product or studio. Search engines count it.
- Your name on the page. Credited as the maker, right under the description, where every visitor sees it.
- Free. Live within a few days.
How it will look
Thanks, we have it.
We'll check the repo and email you when your name is on the listing.
Similar
Same brief, other skills
Blue Laser Clean Glass Layout (Meng To)
Blue Laser Clean Glass Layout puts Tally on near-black with a thin blue light beam, frosted glass panels and Inter Tight with mono labels. The dashboard is the stronger page: clear cards, blue bars and readable tables. The mobile dashboard scrolls sideways. Pick it for technical or premium dark products.
updated today
CSS Border Gradient (Meng To)
CSS Border Gradient takes Tally dark: deep navy panels with faint mint-edged gradient borders, Fraunces headlines over Manrope on the landing and Inter on the dashboard, with mint, amber and coral accents. The dashboard is clean and colorful without getting loud. Pick it if you want a polished dark product with a soft glow.
updated today
Dark Blue Contrasting Clean (Meng To)
Dark Blue Contrasting Clean gives Tally a deep navy page with bright cobalt gradient blocks, crisp frames, Inter and lots of JetBrains Mono labels. The dashboard leads with a cobalt summary card and stays clear and readable. Pick it for confident, technical-feeling products.
updated today
Dark Glass Clean Layout (Meng To)
Dark Glass Clean Layout is the neutral version of dark mode: near-black zinc surfaces, frosted cards, Inter with mono labels and almost no color beyond a pale green. It looks expensive and quiet, but both pages scroll sideways on a phone. Pick it for premium, understated products.
updated today
Also for these tasks
Corporate (Awesome Design Skills)
Corporate gives Tally a clean enterprise look: a 12-column grid, Poppins headings over Open Sans, blue as the main color and violet accents. The dashboard has a white sidebar, summary cards and a tidy envelope grid. It is safe and orderly, but the mobile dashboard scrolls sideways. Pick it for B2B products that want to look established.
updated 4mo ago
Enterprise (Awesome Design Skills)
Enterprise gives Tally a dark cloud-console look: near-black pages, IBM Plex Sans, glass-like panels on an 8pt grid and a brand blue for buttons. The dashboard is dense and readable, with green, amber and red only for status. It is clean and clearly not the default, though it looks like many dark admin consoles. Pick it for dark B2B dashboards.
updated 4mo ago
Framed Tech Dark Border Gradient (Meng To)
Framed Tech gives Tally a near-black page inside one framed shell: thin edge rails, corner markers, 1px gradient borders and uppercase mono labels, with a sparse mint accent. The dashboard uses the same framed shell, mint for money left and coral for overspending. It is clean and precise, but both mobile pages scroll sideways. Note that the landing and dashboard come from two different test days. Pick it for developer and infra products.
updated today
High Contrast Skeuomorphic Clean (Meng To)
High Contrast Skeuomorphic gives Tally a dark charcoal app shell on a warm light-grey page, with molded panels, thin edge highlights, recessed wells and one mint-green signal color. The dashboard uses the same molded shell with a lime accent and coral for overspending. It is clean and tactile on both pages. Pick it for premium, hardware-like product pages.
updated today