Colorize

pbakaus/impeccable

A solid approach to adding purposeful color to gray, monochromatic interfaces without creating rainbow chaos. It runs through semantic color strategy (greens for success, reds for errors), applies the 60-30-10 color distribution rule, and uses OKLCH color space for perceptually uniform palettes. The skill checks WCAG contrast ratios and avoids the classic mistake of relying on color alone for meaning. What I like is how it emphasizes restraint over saturation and pushes you to justify every color choice with semantic purpose rather than just making things look "more vibrant."

skills.sh installs

80.9K

GitHub stars

107K

last updated

Aug 21, 2026

Sponsors

Promote your product hereReach 125k+ visitors monthlyPromote your product hereReach 125k+ visitors monthlyAgent CaffeineSponsoredClose your lid, come back to finished workSnugSponsoredThe clipboard manager for the AI eraPromote your product hereReach 125k+ visitors monthlyWaxSponsoredBlock anything with supervision, without erasing your iPhonePromote your product hereReach 125k+ visitors monthlyknobsSponsoredSee your site on any phone, any day, in any language

Recommended

More Design & UI/UX

1bolderpbakaus/impeccableAmplify safe or boring designs to make them more visually interesting and stimulating. Increases impact while maintaining usability. Use when the user says the 80Kskills.sh installs

2frontend-ui-engineeringaddyosmani/agent-skillsBuilds production-quality, accessible, responsive user-facing UIs. Use when building or modifying interfaces and pages, creating components, implementing layout77.8Kskills.sh installs

3make-interfaces-feel-betterjakubkrehel/make-interfaces-feel-betterDesign engineering principles for making interfaces feel polished. Use when building UI components, reviewing frontend code, implementing animations, hover stat76Kskills.sh installs

4css-animationsheygen-com/hyperframesCSS animation adapter patterns for HyperFrames. Use when authoring CSS keyframes, animation-delay based timing, animation-fill-mode, animation-play-state, or CS72.3Kskills.sh installs

5waapiheygen-com/hyperframesWeb Animations API adapter patterns for HyperFrames. Use when authoring element.animate() motion, Animation currentTime seeking, document.getAnimations(), Keyfr68.7Kskills.sh installs

6enhance-promptgoogle-labs-code/stitch-skillsTransforms vague UI ideas into polished, Stitch-optimized prompts. Enhances specificity, adds UI/UX keywords, injects design system context, and structures outp59.4Kskills.sh installs