Saltar al contenido
duxt

Iconos

Cuatro conjuntos de iconos, y la única pregunta que decide cuál de ellos dibuja una marca.

duxt toma de cuatro colecciones de Iconify. La pregunta nunca es «cuál queda mejor aquí», sino qué es aquello que se dibuja, porque esa es la única prueba que da dos veces la misma respuesta.

ConjuntoDibujaColorSe nombra en
lucidela interfaz que duxt dibuja por su cuentamonocromo, hereda currentColoren cualquier sitio; el estándar
vscode-iconsun archivo, el lenguaje de un bloque, una herramienta del stackpropiofile-icons.ts, y las pestañas de gestores
Simple Iconsuna plataforma, un servicio o una empresa como talmonocromoel componente que lo nombra
flag-iconsla región de un localepropioDuxtLocale, derivado

La regla

Decide qué es lo que se dibuja, y hay dos clases de marca:

  • El stack —un archivo, el lenguaje de un bloque, una herramienta que ejecutas— es vscode-icons. Lleva los colores reales en el propio archivo, y eso es justo lo que necesitan un árbol de archivos y una cabecera de código.
  • Un tercero como tal —una plataforma, un servicio, una empresa a la que el sitio enlaza o a la que entrega algo— es Simple Icons.

Todo lo que no es una marca —un control de copia, un chevrón, una lupa, una flecha de enlace externo— es lucide, y no requiere decisión.

Enunciada por ámbito y no por disponibilidad, la regla se prolonga sola. Laravel, GitHub, Discord y OpenAI son Simple Icons porque son partes que este sitio nombra, no piezas del stack con el que está construido. Los gestores de paquetes son vscode-icons porque una pestaña que ejecuta pnpm add nombra una herramienta del stack.

Por qué no un solo conjunto para todo

Porque monocromo y con color propio son trabajos distintos, no gustos distintos.

Un icono de interfaz debe tomar el color del texto, o pelea con cada estado a su alrededor: hover, activo, atenuado, deshabilitado. lucide hereda currentColor, así que el control se estiliza una vez y el icono lo sigue.

Un icono de tipo de archivo debe conservar sus colores, o un árbol de archivos se convierte en una columna de formas grises idénticas. Para eso existe vscode-icons, y por eso app/utils/file-icons.ts mapea allí cada extensión y cada identificador de lenguaje.

El color no es cosa nuestra

Las pestañas de gestores de paquetes eran antes Simple Icons teñidos a mano: ocho valores hexadecimales, dos por gestor, porque uno solo no sirve para los dos temas —el crema de bun desaparece sobre blanco y el rojo de npm se enturbia sobre negro—. Cada uno era un número que alguien leyó en una página de marca y tendría que volver a leer cuando la marca cambiara.

vscode-icons eliminó la tabla llevando los colores en el propio archivo. Cuando una marca aún necesita ayuda, la colección suele decirlo ella misma: pnpm son cuadrados naranjas y blancos, así que medio retículo desaparece sobre una página blanca — y vscode-icons publica file-type-light-pnpm con #4e4e4e en lugar del blanco, justo para eso. No publica variante clara para ningún otro gestor de los que hay aquí.

Licencias, y lo que una licencia no puede conceder

Las cuatro colecciones son permisivas y compatibles con la MIT de duxt: vscode-icons y flag-icons son MIT, lucide es ISC, Simple Icons es CC0-1.0. Cada una se nombra con su licencia en la página de créditos, porque icon.clientBundle incrusta los SVG en lo que se publica — el paquete transporta las obras, así que transporta los avisos.

Una licencia sobre el archivo no es una licencia sobre la marca. Simple Icons lo dice en su propia LICENSE: CC0 libera el SVG y no puede liberar un derecho de marca que nunca tuvo. Lo mismo vale para los tipos de archivo de vscode-icons: MIT cubre el dibujo, no las marcas de Python, Rust o Vue que hay dentro.

Lo que hace duxt es uso nominativo: el logo de bun está en la pestaña que ejecuta bun add, el icono de Python etiqueta un bloque de Python, y las marcas de Claude y OpenAI están en los botones que envían la página a esos servicios. Nombrar algo para identificarlo es el uso que el derecho de marcas permite sin autorización. Usar una de esas marcas como logo, favicon o aval de duxt no lo sería — y duxt no lo hace.

¿Le ha resultado útil esta página?