Herramienta gratis

Generador de paletas de colores

Arrastra una foto. Obtén sus colores principales con códigos HEX y RGB, una comprobación de contraste con texto blanco y negro, y una vista previa de una página de bio con esos colores.

Tu foto

Número de colores
Orden

Tu paleta

    Vista previa en una página de bio

    Ana Ruiz

    Cerámica y clases de alfarería

    Compra las nuevas tazasReserva una claseÚltimo video

      Qué hace un generador de paletas de colores

      Un generador de paletas de colores encuentra los colores principales de una imagen y te da sus códigos. Este lee tu foto en el navegador, agrupa los píxeles parecidos y devuelve los 5, 6 u 8 colores que cubren más superficie de la imagen. Cada color incluye su código HEX y RGB y una comprobación de contraste para el texto.

      Los creadores de contenido sacan la paleta de sus propias fotos para que su perfil, sus publicaciones y su página de bio parezcan un conjunto. La comprobación de contraste te dice qué colores sirven para el texto y cuáles van mejor como fondo o como detalle.

      Tu foto nunca sale de tu dispositivo. La herramienta la dibuja en un lienzo (canvas) de tu navegador, así que no hay subida, ni cuenta, ni límite.

      Cómo hacer una paleta a partir de una foto

      1. Arrastra una foto

        Usa una foto que publiques a menudo, como tu foto de perfil o la de un producto. Sirven archivos JPG, PNG y WebP.

      2. Elige cuántos colores

        Elige 5, 6 u 8 colores. Ordénalos por la parte de la foto que cubren o de claro a oscuro.

      3. Comprueba el contraste

        Cada color muestra su contraste con texto blanco y con texto negro. Usa los que cumplen para los botones con texto.

      4. Copia los códigos

        Copia un código HEX, la lista completa o la paleta como variables CSS para tu sitio web.

      Reglas de contraste para el texto sobre tus colores

      Las Pautas de Accesibilidad para el Contenido Web (WCAG 2.2) fijan el contraste mínimo entre el texto y su fondo. Las etiquetas de la herramienta usan estos números.

      Qué compruebasProporción mínimaRegla WCAG
      Texto normal sobre un color4.5:11.4.3 Contraste (mínimo), nivel AA
      Texto grande: 24 px, o 18.5 px en negrita3:11.4.3 Contraste (mínimo), nivel AA
      Texto normal, nivel más exigente7:11.4.6 Contraste (mejorado), nivel AAA
      Texto grande, nivel más exigente4.5:11.4.6 Contraste (mejorado), nivel AAA
      Un botón o un icono sobre la página3:11.4.11 Contraste de elementos no textuales, nivel AA

      Fuentes: W3C, Understanding 1.4.3 Contrast (Minimum), W3C, Understanding 1.4.6 Contrast (Enhanced), W3C, Understanding 1.4.11 Non-text Contrast. Consultadas el 11 de noviembre de 2026.

      En tu página de More.You

      Tus colores en tu página de bio

      En una página de More.You eliges tú el fondo, los botones, las fuentes y los colores. Cada cambio va a un borrador con opción de deshacer, así que tu página publicada nunca muestra un diseño a medias.

      more.you/

      • Temas y colores en el plan Free

        Elige un tema y cambia el fondo, el estilo de los botones, las fuentes y los colores. Mezcla la galería de temas cuando busques ideas.

        Temas y diseño

      • Empieza con una plantilla

        Las plantillas por profesión te dan una primera página ya hecha. Aplica una y cambia sus colores por los de tu foto.

        Plantillas de link in bio

      • Cinco diseños de cabecera

        Las cabeceras clásica, hero, banner, recorte y forma colocan tu foto donde mejor encaja con tu paleta.

      Preguntas sobre la paleta de colores

      ¿Cómo elige los colores el generador de paletas?

      Reduce tu foto a una copia pequeña, lee cada píxel y los reparte en grupos de colores parecidos con un método llamado “median cut”. Promedia cada grupo, descarta los colores casi iguales y se queda con los que cubren más parte de la foto.

      ¿Se sube mi foto a algún sitio?

      No. La herramienta abre tu foto en el navegador y la lee en un elemento canvas de tu dispositivo. No se envía nada a More.You ni a ningún otro servidor, y no se guarda nada. Cierra la pestaña y la foto y la paleta desaparecen.

      ¿Qué significan los códigos HEX y RGB?

      Los dos describen el mismo color. RGB indica la cantidad de rojo, verde y azul de 0 a 255, por ejemplo rgb(178, 246, 227). HEX escribe esos tres números en base 16 tras el signo #, por ejemplo #B2F6E3. La mayoría de las apps de diseño y los creadores de sitios web aceptan cualquiera de los dos.

      ¿Qué contraste necesita el texto para leerse bien?

      WCAG 2.2, el estándar de accesibilidad web, pide una proporción de contraste de al menos 4.5:1 para el texto normal y 3:1 para el texto grande en el nivel AA. Texto grande es el de 24 px, o 18.5 px en negrita. Las etiquetas junto a cada color muestran su proporción con texto blanco y con texto negro.

      ¿Cómo uso la paleta en mi página de bio?

      Usa el color más claro como fondo de la página y un color más fuerte para los botones. Después comprueba que el texto del botón llega a 4.5:1 sobre el color del botón. La vista previa de la herramienta muestra esta combinación y te dice qué parejas cumplen.

      ¿Qué tipos de archivo puedo usar?

      Cualquier imagen que abra tu navegador, como JPG, PNG, WebP y GIF. En un GIF, la herramienta lee el primer fotograma. Si un archivo no se abre, guárdalo como JPG o PNG en tu celular o computadora y vuelve a probar.

      ¿Puedo copiar la paleta como CSS?

      Sí. Haz clic en Copiar como variables CSS para obtener un bloque :root con una variable por color, por ejemplo --color-1: #B2F6E3. Pégalo al principio de tu hoja de estilos y usa var(--color-1) donde necesites el color. Las variables siguen el orden que elegiste, así que --color-1 es el color más usado o el más claro.

      Más herramientas gratis

      Gratis y sin cuenta. Nada de lo que escribas se guarda en nuestros servidores.

      Generador de letras

      Convierte tu texto en 24 estilos, de negrita y cursiva a manuscrita y burbujas. Copia y pega donde quieras.

      Abrir herramienta →

      Generador de bio

      Obtén 12 ideas de bio para Instagram, TikTok, X o YouTube, con contador de caracteres en vivo.

      Abrir herramienta →

      Generador de códigos QR

      Convierte cualquier link en un código QR. Elige colores y descarga PNG o SVG. No vence nunca.

      Abrir herramienta →

      Ver todas las herramientas gratis

      Guías: Guía de diseño de la página de bio: composiciones, temas y botones, Temas para link in bio: cómo elegir uno que convierta.

      Páginas relacionadas
      Fuentes
      1. W3C, Understanding SC 1.4.3 Contrast
      2. W3C, Understanding SC 1.4.6 Contrast
      3. W3C, Understanding SC 1.4.11 Non-text Contrast

      Fuentes revisadas el 11 de noviembre de 2026.

      Tus colores, en tu propia página

      Reserva tu página gratis de More.You y ponle el fondo, los botones y las fuentes con los colores de tu foto.

      more.you/

      Idioma