Design
Convertir valores de color HEX a CMYK para impresión con soporte de canal alfa
hex-to-cmyk-converterDesign
Convertir valores de color HEX a LAB para gestión de color con soporte de canal alfa
hex-to-lab-converterDesign
Convertir valores de color HSL a CMYK para impresión con soporte de canal alfa
hsl-to-cmyk-converterDesign
Convertir valores de color HSL a LAB para gestión de color con soporte de canal alfa
hsl-to-lab-converterDesign
Previsualiza una combinación de fuentes para título y cuerpo con texto real, tamaños, pesos, interlineado, caracteres y CSS.
font-pairing-preview-cardDesign
Pega un JSON de variables de Figma / Tokens Studio y exporta a Tailwind, variables CSS shadcn, Style Dictionary o SCSS. Conserva tokens de color, espaciado y fuente con inferencia de tipos.
figma-tokens-exportDesign
Calcula el campo de visión de una cámara a partir de la focal y el tamaño del sensor, con cobertura de escena a distancia.
field-of-view-calculatorDesign
Extrae design tokens — colores, números, tamaños de fuente y cadenas — de un JSON de tema ECharts y expórtalos directamente a tu design system. Pega un objeto de tema (el que registras y pasas a echarts.init(dom, themeName)) y la herramienta recorre cada hoja, etiquetando cada color (con normalización opcional nombrado/rgb → hex), número de espaciado, tamaño de fuente y cadena, para luego emitir variables CSS limpias, una configuración theme.extend de Tailwind, tokens.json de Style Dictionary o variables SCSS. Tiende el puente entre un tema de visualización ECharts y los tokens de diseño Figma/CSS/Tailwind sin copiar cada valor a mano.
echarts-theme-token-extractorDesign
Genera una firma de correo HTML limpia y lista para copiar-pegar que se ve correctamente en Gmail, Outlook y Apple Mail — con avatar/logo, iconos sociales (auto-detectados desde tus enlaces), color de acento, tema claro/oscuro/auto, y un diseño basado en tablas con estilos en línea seguro para correo. Copia el HTML y pégalo en tu cliente.
email-signature-html-builderDesign
Añade efectos de desenfoque a imágenes con intensidad ajustable y múltiples tipos de desenfoque
image-blurDesign
Ajusta los niveles de brillo de la imagen con vista previa en tiempo real y control preciso
image-brightnessDesign
Ajusta los niveles de contraste de la imagen con control preciso para mayor claridad
image-contrast