Jak porozumet teorii barev

RGB, HEX, HSL jednoduse vysvetleno. Naucte se harmonii barev, doplnkove barvy a prakticke designove aplikace.

Barevne modely vysvetleny

  • RGB (Red, Green, Blue): Additive model for screens. Values 0-255 per channel. rgb(37, 99, 235) is blue.
  • HEX: Hexadecimal RGB. #2563eb = rgb(37, 99, 235). Six hex digits (0-9, A-F).
  • HSL (Hue, Saturation, Lightness): Intuitive model. Hue is 0-360 degrees. Saturation and Lightness are 0-100%.

Prevod mezi formaty

HEX to RGB:

#2563eb
R = 0x25 = 37
G = 0x63 = 99
B = 0xeb = 235
Result: rgb(37, 99, 235)

Use our Color Picker to convert instantly.

Barevna harmonie

  • Complementary: Opposite colors (180 apart). High contrast: blue + orange.
  • Analogous: Adjacent colors (30 apart). Harmonious: blue + teal + green.
  • Triadic: Three colors evenly spaced (120 apart). Vibrant: red + yellow + blue.
  • Monochromatic: Same hue, different lightness. Clean and professional.

Prakticke designove aplikace

  • Backgrounds: HSL lightness 95-98% for light mode, 8-15% for dark mode
  • Text contrast: Minimum 4.5:1 ratio for body text (WCAG AA)
  • Brand colors: 1 primary + 1 accent. SimpyTool uses #2563eb + #10b981
  • Gradients: Analogous colors create smooth gradients

Use our Color Palette and Gradient Generator tools.

Psychologie barev a pristupnost

  • Red: Urgency, passion, errors. Use sparingly.
  • Blue: Trust, stability. Most popular brand color.
  • Green: Growth, success. Good for success states.
  • Yellow: Warning. Hard to read on white.
  • Accessibility: Always test contrast. 8% of men have color blindness.

Casto kladene dotazy

What is the difference between RGB and HEX?
They represent the same color model. HEX is RGB in hexadecimal. #ff0000 = rgb(255, 0, 0) = pure red.
What HSL hue value makes blue?
Hue 210-240 gives blue. Pure blue is 240. The full wheel: 0=red, 60=yellow, 120=green, 180=cyan, 240=blue, 300=magenta.
How many colors can RGB represent?
RGB with 8 bits per channel represents 16,777,216 colors. This covers the entire visible gamut for most displays.
What is WCAG color contrast?
WCAG requires a minimum contrast ratio of 4.5:1 for normal text and 3:1 for large text for accessibility.
How do I create a color palette for my brand?
Start with one primary color. Add a lighter variant for backgrounds, a darker variant for hovers, one accent color, and neutral grays.