Summary
A solid reference for building Notion-style interfaces with all the specific values you'd otherwise have to hunt down in dev tools. Inter font, 4px grid system, that distinctive #97CAEE accent blue, and proper semantic color tokens for light mode. The typography scale is well documented (66px bold headings down to body text), and the interaction guidelines are pragmatic: use AlertDialog for destructive actions, animate only compositor properties, never block paste. It's opinionated in the right ways, like mandating 4.5:1 contrast ratios and respecting prefers-reduced-motion. Most useful when you want Notion's clean aesthetic without reverse-engineering their CSS or making it up as you go.
Install to Claude Code
npx -y skills add ihlamury/design-skills --skill notion-ui-skills --agent claude-codeInstalls into .claude/skills of the current project.
Keep your Mac awake while Claude Code and 40+ AI agents run. Sleeps when they're idle.
One time payment $9 →
Integrate web data into your AI product. One API to scrape website & brand data.
Get API Key Now →
Agent, run crypto. Access onchain data & trade routes via 1inch.
Install now →
On Capafy, your Skill runs online 24/7 as an agent product, and you get paid every time someone uses it.
Start earning →
Files
SKILL.md
Select a file.
Featured
Keep your Mac awake while Claude Code and 40+ AI agents run. Sleeps when they're idle.
One time payment $9 →Integrate web data into your AI product. One API to scrape website & brand data.
Get API Key Now →Agent, run crypto. Access onchain data & trade routes via 1inch.
Install now →On Capafy, your Skill runs online 24/7 as an agent product, and you get paid every time someone uses it.
Start earning →
