Generador de Paletas de Color
Genera paletas de color armoniosas a partir de cualquier color base. Admite esquemas complementarios, análogos, triádicos y monocromáticos.
Complementary
#6366F1#F1EE63Analogous
#63ADF1#6366F1#A763F1Triadic
#6366F1#F16366#66F163Split Complement
#6366F1#F1A763#ADF163Tetradic
#6366F1#F163AD#F1EE63#63F1A7Monochromatic
#0F13AC#1D21EB#6366F1#A1A3F7#D0D1FBCómo usar esta herramienta
- 1
Click the color swatch to open your system color picker, or type a 6-digit hex code like #6366F1 into the text field next to it.
- 2
Watch the six scheme rows update instantly as you change the base color.
- 3
Read the uppercase hex code shown in the bottom-left corner of each swatch and copy the ones you want into your design tool or stylesheet.
¿Qué es el Generador de Paletas de Color?
La teoría del color define relaciones armónicas según las posiciones en el círculo cromático. Los colores complementarios se sitúan en posiciones opuestas (180°). Los análogos son adyacentes (30°). Los esquemas triádicos usan tres colores equidistantes (120°). Esta herramienta calcula cada uno a partir del color base que elijas, dándote una paleta de partida fundamentada en teoría del color probada.
Casos de uso comunes
Picking a primary plus accent color for a website by reading the complementary pair off your brand color.
Building a calm, unified UI background-and-card scheme from the analogous row.
Generating a 5-step monochromatic tint and shade ramp for hover, active, and disabled button states.
Sketching a data-visualization palette where triadic or tetradic colors keep series visually distinct.
Exploring logo or illustration color combinations before committing in Figma or Illustrator.
Quickly grabbing hex codes for a CSS variable set without leaving the browser.
Preguntas frecuentes
¿Qué esquema es mejor para los sitios web?▼
Herramientas relacionadas
Conversor de Color (HEX/RGB/HSL)
Convierte colores entre los formatos HEX, RGB y HSL. Elige un color visualmente o introduce los valores manualmente.
Generador de Box Shadow CSS
Crea valores de box-shadow en CSS de forma visual. Previsualiza en tiempo real y copia el CSS generado.
Generador de Degradados CSS
Crea degradados CSS lineales y radiales. Elige los colores de forma visual y copia el CSS generado.
Generador de Curvas de Aceleración Cubic Bezier
Crea curvas de aceleración cubic-bezier para CSS. Incluye ajustes preestablecidos estándar.
Generador de Border Radius CSS
Crea valores complejos de border-radius en CSS de forma visual. Control independiente de cada esquina.
Generador de CSS Clamp()
Genera valores CSS fluidos y responsivos con clamp(). Escala suavemente entre tamaños mínimo y máximo a lo largo de los rangos del viewport.