Herramientas de diseño

Sobre estas herramientas

Las 36 herramientas de esta sección son gratis, funcionan en tu navegador en cualquier dispositivo y no requieren registro.

• Convertidor de HEX a RGB: Convierte códigos de color HEX a RGB y ve el mismo color en HSL, HSV, CMYK, OKLCH y su nombre.
• Convertidor de RGB a HEX: Convierte colores rgb(…) en códigos HEX y en todos los demás formatos de color.
• Convertidor de HEX a HSL: Convierte colores HEX a HSL, con tonos más claros y más oscuros.
• Comprobador de contraste de color: Comprueba los colores de texto y fondo según WCAG AA/AAA y obtén los colores más cercanos que cumplen.
• Simulador de daltonismo: Mira una imagen o tus colores como los ven las personas con daltonismo.
• Generador de paletas de colores: Genera combinaciones de colores, fija los que te gusten, saca una paleta de una foto y comprueba el contraste del texto.
• Generador de fondos degradados: Diseña degradados lineales, radiales, cónicos y de malla, elige de una galería, copia el CSS o descarga un fondo de pantalla.
• Generador de glassmorphism: Crea tarjetas de efecto vidrio esmerilado con vista previa en directo y copia el CSS.
• Generador de neumorfismo: Crea botones y tarjetas suaves con aspecto 3D (soft UI) y copia el CSS.
• Generador de patrones CSS: Rayas, puntos, cuadrículas, tableros de ajedrez, zigzags y más como fondos de CSS puro o SVG.
• Generador de formas SVG: Estrellas, polígonos, insignias y destellos en SVG o PNG.
• Generador de blobs SVG: Formas orgánicas aleatorias (blobs) para fondos e ilustraciones, en SVG o PNG.
• Generador de ondas SVG: Ondas en capas para separadores de secciones y fondos, en SVG, PNG o CSS.
• Creador de pixel art: Dibuja pixel art en una cuadrícula con modo espejo, relleno y deshacer, y descarga un PNG nítido.
• Generador de arte ASCII: Convierte texto en letras ASCII grandes (muchas fuentes) o una foto en arte ASCII.
• Generador de favicons e iconos de app: Todos los tamaños de icono a partir de una imagen: favicon.ico, Apple touch icon, iconos de Android y PWA, con el código HTML.
• Vista previa de favicon: Mira cómo se ve tu icono en las pestañas del navegador (claro y oscuro), marcadores, resultados de Google y pantallas de inicio de teléfonos.
• Creador de banners para redes sociales: Crea banners para YouTube, LinkedIn, X y Facebook con los tamaños exactos y las zonas seguras marcadas.
• Marco para foto de perfil: Añade un aro de color y texto curvo (como CONTRATANDO o el nombre de un evento) alrededor de tu foto de perfil.
• Combinador de fuentes: Parejas de fuentes para títulos y texto elegidas a mano, incluido el árabe, con vista previa en directo y CSS.
• Diseñador de códigos QR: Códigos QR personalizados: colores, degradados, formas de puntos y esquinas, un logotipo y un marco «Escanéame».
• Creador de logotipos y generador de logos para empresas: Crea un logo sencillo con un nombre, un icono y tus colores, y descárgalo como SVG o PNG.
• Generador de tintes y sombras: Tintes más claros, sombras más oscuras y tonos más suaves de cualquier color, con variables CSS.
• Mezclador de colores: Mezcla dos colores en cualquier cantidad y mira el resultado en HEX, RGB, HSL y OKLCH.
• Rueda de color y armonías: Esquemas de color complementarios, análogos, triádicos y otros desde una rueda de color.
• Cuadrícula de contraste de color: Comprueba de una vez cada par de texto y fondo de tu paleta según WCAG.
• Nombres de colores CSS: Los 148 nombres de colores CSS con sus códigos, y el nombre más cercano para cualquier color.
• Kelvin a RGB (temperatura de color): Convierte la temperatura de color de una luz (2700 K, 6500 K…) en su color HEX y RGB.
• Generador de paleta de colores de Tailwind: Crea una escala de colores de Tailwind CSS de 50 a 950 a partir del color de tu marca, para v3 o v4.
• Generador de paleta de colores Material: Paletas tonales al estilo Material 3 y roles de color claros y oscuros a partir de un color base.
• Generador de escala de sombras: Crea un conjunto de sombras de caja a juego (niveles de elevación) como variables CSS.
• Generador de escala de colores: Pasos suaves entre dos colores para gráficos, mapas y degradados.
• Generador de texto con degradado: Crea texto con degradado de colores con CSS, o descárgalo como PNG transparente.
• Extraer colores de una imagen: Encuentra los colores principales de una foto o logo, con la proporción de cada uno.
• Comprobador de paletas aptas para daltonismo: Comprueba si las personas con daltonismo pueden distinguir los colores de tu paleta.
• Generador de colores aleatorios: Colores aleatorios vivos, pastel, oscuros o terrosos, con nombres, códigos HEX y bloqueos.