retool-ui-skills
Retool UI Skills
Opinionated constraints for building Retool-style interfaces with AI agents.
When to Apply
Reference these guidelines when:
- Building light-mode interfaces
- Creating Retool-inspired design systems
- Implementing UIs with Inter font and 4px grid
Colors
- SHOULD use light backgrounds for primary surfaces
- MUST use
#E3E6D7as page background (surface-base) - MUST use
#80AEF2for primary actions and focus states (accent) - SHOULD reduce color palette (currently 21 colors detected)
- MUST maintain text contrast ratio of at least 4.5:1 for accessibility
More from ihlamury/design-skills
awwwards-ui-skills
Awwwards's UI design system. Use when building interfaces inspired by Awwwards's aesthetic - light mode, Inter font, 4px grid.
211apple-ui-skills
Apple's UI design system. Use when building interfaces inspired by Apple's aesthetic - light mode, Inter font, 4px grid.
158dribbble-ui-skills
Dribbble's UI design system. Use when building interfaces inspired by Dribbble's aesthetic - light mode, Inter font, 4px grid.
135airbnb-ui-skills
Airbnb's UI design system. Use when building interfaces inspired by Airbnb's aesthetic - light mode, Inter font, 4px grid.
124figma-ui-skills
Figma's UI design system. Use when building interfaces inspired by Figma's aesthetic - light mode, Inter font, 4px grid.
113linear-ui-skills
Linear's UI design system. Use when building interfaces inspired by Linear's aesthetic - dark mode, Inter font, 4px grid.
112