Herramientas CSS y de color
Las herramientas de diseño de Nouplo para el desarrollo front-end en un solo lugar: CSS listo para pegar, conversión de colores y comprobación del contraste, paletas y selectores de color, e iconos, SVG y texto de relleno. Todo funciona en tu navegador.
Generadores CSS
Color y contraste
◒ Conversor de color HEX, RGB, HSL y CMYK, más la relación de contraste que decide la legibilidad. ◐ Comprobador de contraste Si alguien puede leerlo de verdad. ◒ Herramientas de imagen Generador de paletas de colores Pulsa la barra espaciadora para otra paleta; bloquea los colores que te gusten. ◉ Herramientas de imagen Selector de color de imagen Un clic para un código de color, un botón para la paleta de la imagen. ◉ Herramientas de imagen Paleta de colores de una imagen Los colores principales de la imagen, en códigos hex. ◒ Herramientas de imagen Simulador de daltonismo Alrededor de uno de cada doce hombres no puede leer una leyenda roja sobre verde.
Iconos, SVG y texto de relleno
◰ Herramientas de imagen Generador de favicon Entra una imagen; salen favicon.ico, apple-touch-icon, iconos del manifiesto y las etiquetas para pegar. ⇄ Conversores SVG a PNG Convierte un vector en un mapa de bits nítido para las plataformas que no aceptan SVG, sin enviarlo a ningún sitio. ◇ Conversores Imagen a SVG Una imagen convertida en contornos que aguantan cualquier tamaño. • Herramientas de texto Lorem Ipsum Texto de relleno para maquetas y diseños, con los párrafos, frases o palabras que necesites.
Preguntas frecuentes
- ¿Puedo pegar el resultado directamente en mi hoja de estilos?
- Sí. Las páginas de degradado, box-shadow y cubic-bezier escriben la propia declaración CSS, lista para copiar, y el conversor de color da el mismo color en cada notación CSS.
- ¿Qué norma de contraste usa el comprobador?
- WCAG 2: muestra la relación de contraste y si una pareja de colores cumple AA y AAA para texto normal, texto grande y elementos de la interfaz.
- ¿Por qué algunas tarjetas llevan a otro sitio?
- El generador de paletas, el selector de color y el generador de favicon trabajan con imágenes, así que están en el sitio de imágenes de Nouplo; la conversión a SVG está en el sitio de conversores, y el lorem ipsum, en el sitio de texto. Las tarjetas indican adónde llevan.
- ¿Se suben mis imágenes?
- No. Las imágenes que abres para tomar colores o crear un favicon se leen en tu navegador y nunca salen de tu dispositivo.