Palette

¿Qué es Palette?

Palette es una herramienta que genera una paleta de colores personalizada para Tailwind CSS a partir de un texto. Está diseñada para ayudarte a producir rápidamente swatches de colores consistentes para tu UI, en lugar de construir una paleta manualmente.

El generador admite modo claro y oscuro, incluye swatches neutros y proporciona degradados para tus colores personalizados, por lo que la salida se puede usar directamente en sistemas de diseño basados en Tailwind.

Características principales

• Genera paletas de colores para Tailwind a partir de un texto, ayudándote a traducir una descripción de color en swatches estructurados.
• Soporte para modo claro, produciendo un conjunto de colores para contextos de UI estándar (claro).
• Soporte para modo oscuro, generando un conjunto correspondiente de colores para contextos de UI oscuro.
• Swatches neutros, incluyendo tonos de escala de grises/neutros comúnmente necesarios como parte de la salida de la paleta.
• Degradados para colores personalizados, proporcionando múltiples niveles de intensidad para cada color generado y cubrir estados e jerarquía de la UI.

Cómo usar Palette

1. Introduce un texto describiendo los colores que quieres (p. ej., un tema, estado de ánimo o dirección de color específica).
2. Genera la paleta y revisa los swatches producidos.
3. Usa las salidas de modo claro y oscuro en tu configuración de Tailwind.
4. Aplica los swatches neutros y los degradados generados para un estilo consistente en todos los componentes.

Casos de uso

• Crea una paleta inicial de Tailwind para un nuevo proyecto cuando ya conoces la dirección visual pero no quieres definir cada degradado manualmente.
• Construye variantes de temas claro y oscuro para una interfaz generando ambos modos desde el mismo flujo basado en texto.
• Genera tonos neutros junto con colores de marca o de acento para soportar fondos, bordes y texto en un sistema de diseño.
• Produce múltiples degradados para colores personalizados para mapear colores a diferentes superficies y estados de la UI.
• Itera en una paleta ajustando el texto para refinar el aspecto manteniendo la salida estructurada para Tailwind.

Preguntas frecuentes

¿Palette genera colores para modo claro y oscuro?

Sí. El producto admite paletas de modo claro y oscuro.

¿Qué tipo de salida proporciona Palette?

Genera una paleta de colores personalizada para Tailwind, incluyendo swatches neutros y degradados para tus colores personalizados.

¿Puedo usar Palette para un sistema de diseño basado en Tailwind?

Sí. Dado que la salida se describe como una paleta de colores de Tailwind con degradados y neutros, encaja en flujos de trabajo de estilos típicos de Tailwind.

¿Qué entradas usa Palette?

El producto genera paletas a partir de un texto que describe la dirección de color que quieres.

Alternativas

• Herramientas de colores para sistemas de diseño: Herramientas que ayudan a definir paletas, generar ramps/degradados y exportar tokens de color para frameworks de UI. A menudo requieren especificar colores de forma más directa, mientras que Palette es impulsada por texto.
• Asistentes de configuración de Tailwind: Utilidades enfocadas específicamente en generar o gestionar colores de tema de Tailwind. Pueden enfatizar la exportación a flujos de tailwind.config y no centrarse en generación basada en texto.
• Generadores de temas de UI de propósito general: Herramientas que crean tokens de tema (claro/oscuro) y los mapean a componentes. Comparadas con Palette, pueden generar tokens de diseño más amplios más allá de solo colores de Tailwind.
• Generadores de paletas de color (no específicos de Tailwind): Generadores que crean esquemas de color y ramps a partir de entrada del usuario. Pueden ayudarte a explorar estéticas, pero normalmente haces el mapeo a Tailwind tú mismo.