Color guides

A practical guide to HEX, RGB, HSL, HSV, CMYK, LAB, and XYZ — when to use each space for web, print, and design workflows.

Why client-side color tools are private, fast, and suitable for sensitive brand work.

Understand AA and AAA contrast requirements, how to test text and UI components, and how to fix failing pairs.

Build harmonious palettes using complementary, analogous, triadic, and neutral scales for product UI.

Export color tokens for CSS custom properties, Tailwind config, JSON design systems, and cross-platform apps.

Generate 50–950 ramps from a brand seed and export ready-to-paste Tailwind theme configuration.

Create Material 3 seed-based themes with primary, secondary, tertiary, and surface roles.

When and how to convert between HEX, RGB, HSL, CMYK, LAB, and XYZ for web and print.

Compare eyedropper, screen, image, and advanced picker workflows for designers and developers.

Generate random, brand, harmony, and theme colors with export-ready outputs.

Build accessible palettes from seeds, images, or harmony rules.

Linear, radial, and conic gradients with OKLCH-friendly interpolation tips.

Document primary, secondary, and neutral brand tokens for cross-team consistency.

Shadows, glassmorphism, borders, and CSS-native color functions.

Why perceptual spaces produce better gradients and accessible themes.

Focus indicators, target size, and contrast requirements affecting color choices.

Use @theme and CSS-first configuration for Tailwind v4 color systems.

Extract and refine palettes from logo images locally.

Simulate protanopia, deuteranopia, and tritanopia; do not rely on hue alone.

Build dark themes without pure #000 backgrounds and clipped shadows.

Complementary, triadic, analogous, and split-complementary schemes explained.