Color Palette Generator

Genera paletas de color armoniosas desde un color base

🔒 100% en el browser🆓 Gratis para siempre⚡ Sin sign-up
Nota: La interfaz de la herramienta de abajo por ahora solo está en inglés. Estamos traduciéndolas una a una. Ver esta herramienta en inglés →

Click any value to copy.

Cómo funciona

  1. 1
    Elige un color base

    Usa el color picker o escribe un HEX.

  2. 2
    Elige una armonía

    Complementary, analogous, triadic, tetradic, split-complementary o monochromatic.

  3. 3
    Copy cualquier color

    One-click copy en HEX, RGB o HSL para usar directo en CSS, Figma o Tailwind.

Sobre Color Palette Generator

Color palette generator gratis online. Ingresa cualquier color base y saca una paleta armoniosa - complementary, analogous, triadic, tetradic o monochromatic. Copia cualquier color como HEX, RGB o HSL. Ideal para designers y devs armando sistemas de brand. Color Palette Generator en 712 Tools corre entero dentro de tu browser con APIs nativas de JavaScript - ningún server ve tus datos. Eso significa resultados al instante, privacidad total y sin límites de upload.

Ya sea para una sesión de debug, una comprobación rápida o un incidente en producción, esta herramienta es gratis y sin límite de usos. Sin watermarks, sin sign-up y sin ads dentro de la herramienta.

Preguntas frecuentes

¿'Complementary' vs 'analogous'?

Complementary agarra el color opuesto en la rueda (alto contraste). Analogous agarra los de al lado (suave, cohesivo).

¿Qué armonía usar para una brand?

Analogous o monochromatic se leen como calma y cohesión. Complementary o triadic se leen como bold y energía.

¿Chequea contrast WCAG?

Aún no - pero podés copiar dos colores cualquiera y pegarlos en un contrast checker tipo WebAIM.

¿Se sube mi color base?

No. La matemática de la paleta corre entera en tu browser.

Leer más

5 min de lectura

The WCAG color contrast checklist every designer should bookmark

AA vs AAA, the math behind the ratios, why gray-on-gray fails on retina screens, and the two-line HTML that makes a color contrast test run in seconds.

5 min de lectura

Glassmorphism, neumorphism, and where 2026 UI is actually heading

The design trends that shipped, the ones that flopped, and what makes modern UI actually feel modern - from frosted glass to soft shadows to conic gradients.

4 min de lectura

CSS box-shadow patterns that look professional (not cheap)

A single 5px shadow makes any UI look like a bootstrapped 2015 landing page. Here are the layered-shadow patterns that modern design systems use - Material, Tailwind, Apple.

4 min de lectura

CSS gradient patterns that actually look good (and the two that don't)

Two colors and a 45° angle is not a gradient - it's a shortcut to a design that looks like every SaaS site from 2018. Here's how to build ones that don't.

Herramientas relacionadas

Color Converter

Convierte entre HEX, RGB, HSL y CMYK con preview en vivo

CSS Gradient

Diseña gradients CSS linear, radial y conic con preview en vivo

Box Shadow

Diseña box-shadows CSS multi-layer con preview en vivo

Contrast Checker

Chequeá contraste texto/background contra WCAG 2.1 AA y AAA - preview en vivo

Glassmorphism

Diseñá cards CSS de frosted-glass con preview en vivo y código copy-ready

Physics Editor

Editor de hitbox de sprites gratis online - auto-traceá collision polygons y exportá para Phaser, Matter.js, Rapier o cualquier engine 2D