Glassmorphism (Web Animation Skills)
3/5 out of 5. Read the verdictFrosted glass panels over violet, teal and coral glows on navy-black, in Manrope and Instrument Serif. For AI and fintech apps.
Made by 
First screen only. Switch to side by side to read the full pages.
Scroll either page; the other follows.
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
Glassmorphism puts Tally on a dark night sky: frosted, edge-lit panels float over drifting violet, teal, coral and amber glows, with bold Manrope headlines and italic Instrument Serif accents in a violet-to-pink gradient. The dashboard carries it through with a mint progress ring for the $640, colorful gradient envelope bars and JetBrains Mono figures. The look is far from the default and text stays readable, but an 'On track' chip covers the bill reminder in the hero, the phone dashboard scrolls sideways, and it sits in familiar dark-SaaS territory. Pick it for AI tools, crypto or night-mode products that want color and depth.
Compare with Premium Frontend Design (kv0906)Pick it for
- AI products
- crypto and fintech apps
- dark-mode dashboards
- music and media apps
Skip it for
- calm, warm consumer brands
- print-like editorial pages
- accessibility-first services
Typography
Colors
Observations
- the phone dashboard scrolls sideways
- landing hero: the 'On track' chip covers the bill reminder text
- close to many dark glass SaaS templates
Install
1 Run in your terminal
npx degit iart-ai/web-animation-skills/skills/glassmorphism#main .claude/skills/glassmorphism2 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 installed the glassmorphism folder from this repo.
Details
Made by
iart-aiOrg
Is this you? Claim it
- Type
- Skill
- GitHub stars
- 47*
- Updated
- 4mo ago
- License
- MIT
- Best for
- Visual direction
Test runOpus 5.5Claude Code 2.1.303Oct 20, 2026generated in 6 minabout $1.44 at API pricescommit b6dba3e
* Stars are for the whole iart-ai/web-animation-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/iart-glassmorphism/) 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. Usually 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
Liquid Glass Design (ECC)
Liquid Glass Design builds Tally out of frosted glass panels floating over soft mint, peach and periwinkle light, set in Bricolage Grotesque and DM Sans. The dashboard keeps the glass in Manrope and stays readable. Pick it if you want a friendly, Apple-flavored product that looks nothing like the cream-and-serif default.
updated 2d ago
Popular Web Designs (Hermes Agent)
Popular Web Designs gives Tally the Wise treatment: very heavy black Inter headlines, a lime highlight box around 'job.', pill buttons, big rounded cards and a black pricing band with a lime Plus plan. The dashboard follows through with a black 'left to budget' card in huge lime numerals, lime envelope bars and a lime October bar. It is far from the default and holds together on both pages and on a phone, though the tight headline leading lets lines collide and a sync chip covers the Groceries label in the hero. Pick it when you want a bright, confident consumer fintech look and are happy to start from a known brand's style.
updated today
Impeccable
Impeccable drops the cream-and-serif default for a loud navy, orange and primary-color landing page set in heavy Archivo, then builds a calmer pine-and-lime dashboard. Pick it if you want a product page with real energy that still holds up on a dense screen.
updated 1d ago
Hallmark
Hallmark turns Tally into a cheerful yellow-and-pastel brand in Plus Jakarta Sans with big ghost numerals, and the dashboard matches it. The most consistent result in the set, but it took about 12 minutes per brief.
updated 2mo ago
Also good for these
Motion Web
Motion Web gives Tally an editorial landing page: paper #f1ece1, a huge Instrument Serif headline with 'accounted' in vermilion italic, JetBrains Mono labels, line-drawn envelopes that fill with a sample paycheck, and a big 'iOS / Android' type band. The dashboard does not follow; it falls back to a green sidebar, Fraunces numbers and cream cards close to the default. Pick it for a motion-led landing page, and plan to restyle the app screens.
updated 32d ago
Glass Dark UI (Meng To)
Glass Dark UI turns Tally into a dark navy product with frosted panels and gradient borders, lit by green, blue and violet accents. Text stays readable on both pages. Pick it if you want a polished dark interface, but expect it to look like plenty of other dark SaaS sites.
updated today
GPT Taste (Taste Skill)
GPT Taste builds a soft, polished Tally in Geist on warm paper, with mint and amber gradients, a dark green band and a huge 'tally' wordmark in the footer. The dashboard is a clean moss-green layout. Pick it for a well-finished startup page, though the green comes straight from the default.
updated today
Apple Design (Emil Kowalski)
Emil Kowalski's Apple design skill goes for the iOS feel: the system font, an off-white canvas, a green accent and a drag-to-move-money demo that behaves like a native control. The dashboard switches to Inter with Apple's system colors. Pick it if motion and touch feel matter more than a bold look.
updated 6d ago