Apply Readwise's UI design system constraints to light-mode web interfaces.
npx skills add https://github.com/ihlamury/design-skills --skill readwise-ui-skills
Please help me install this Agent Skill. Skill: readwise-ui-skills Source: https://github.com/ihlamury/design-skills/tree/main/skills/readwise Command: npx skills add https://github.com/ihlamury/design-skills --skill readwise-ui-skills
This Skill provides opinionated constraints for building interfaces that are visually consistent with Readwise's aesthetic, ensuring a familiar and high-quality user experience.
Apply Readwise's UI design system to a new web component.
High-intent search queries and answers about installing and using this skill.
To apply a consistent UI design system for light-mode web interfaces, use defined semantic color tokens, the Inter font for typography, a 4px grid for spacing, and specific border-radius scales. This ensures visual consistency and a polished, modern aesthetic.
Readwise UI design requires applying specific semantic color tokens for light mode and using the Inter font for typography. It enforces a minimum text contrast ratio of 4.5:1 to ensure accessibility and visual consistency.
This UI design system is optimized exclusively for light-mode interfaces. It focuses on applying semantic color tokens and accessibility constraints specifically tailored for light mode productivity app features.
To ensure web components meet accessibility standards using a 4px grid, the design system enforces a minimum text contrast ratio of 4.5:1. This rule applies alongside strict spacing and semantic color token constraints for light mode.
Use semantic color tokens and border-radius scales in UI design when building clean, modern productivity app features that require strict visual consistency. This approach ensures components adhere to a defined aesthetic and maintain accessibility.
Yes, you can use this design system to build interfaces that feel like Readwise by strictly applying its specific color palette, Inter typography, 4px spacing grid, and defined border-radius scales for a familiar user experience.
ihlamuryEnforce Gusto's UI design system constraints for light-mode interfaces.
DanielV-94Enforce Awwwards-style UI design guidelines with Inter font and 4px spacing grid.
ihlamuryEnforce Superhuman's UI design system with Inter font and a 4px grid.
ArogyaReddyDefine typography, color, spacing, and iconography design tokens for web and mobile UI.
