skills.rest
hossain-khan
hossain-khanCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

colorize

Apply strategic color palettes to monochromatic UI designs.

Updated Mar 13, 2026
Search Tags:#design#branding#accessibility#ui-design#color-palette#oklch#colorize
One-click install
npx skills add https://github.com/hossain-khan/hk-vision-slideshow --skill colorize-hossain-khan
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: colorize
Source: https://github.com/hossain-khan/hk-vision-slideshow/tree/main/.agents/skills/colorize
Command: npx skills add https://github.com/hossain-khan/hk-vision-slideshow --skill colorize-hossain-khan

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Colorization that adds strategic, purposeful color to otherwise monochromatic interfaces, increasing warmth, meaning, and visual hierarchy.

Core Features & Use Cases

  • Strategic color palette planning aligned with brand and context
  • Semantic color mapping for states (success, error, info) and categories
  • Accessibility-conscious application across surfaces, components, and typography
  • Mood and brand alignment for marketing, product, and UI design

Quick Start

Apply a strategic color palette to the current design to improve hierarchy and accessibility.

Frequently Asked Questions about colorize

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I apply a color palette to a monochromatic UI design?▼

To apply a color palette to a monochromatic UI design, map 2-4 strategic colors to interface components, states, and data visualizations to improve visual hierarchy, accessibility, and emotional resonance.

What is semantic color mapping for UI states?▼

Semantic color mapping for UI states assigns specific palette colors to success, error, and info actions, ensuring clear visual feedback and consistent usage across all interface components and branding materials.

How do I check color accessibility for UI components?▼

Check color accessibility for UI components by verifying contrast ratios across typography and surfaces using a 2-4 color palette in OKLCH space, ensuring readable hierarchy for all users.

Can I use OKLCH color space for UI design palettes?▼

Yes, you can use OKLCH color space to define 2-4 color palettes for UI design, which allows for perceptually uniform color adjustments and consistent accessibility checks across components.

What is the best way to add color to data visualizations?▼

The best way to add color to data visualizations is applying a strategic color palette with semantic mapping, improving hierarchy and accessibility while aligning with overall brand context and mood.

Related Skills

Explore More Design & Creative Skills→
julianromlijulianromli

colorize

Introduce strategic color into monochromatic UI designs with semantic mapping.

Community
Intermediate
StartaleGroupStartaleGroup
3

colorize

Apply WCAG-compliant semantic color palettes to UI components and surfaces.

Official
Advanced
yournextstoreyournextstore
5.5k

critique

Analyze interface layouts, typography, color, hierarchy, and accessibility to identify usability flaws.

Official
Advanced
Shaarav4795Shaarav4795

colorize

Define WCAG-compliant color palettes for monochromatic UI designs.

Community
Intermediate