IconPark: biblioteca de iconos de código abierto de ByteDance 99

IconPark 图标库 es una biblioteca de iconos de estilo vectorial diseñada y de código abierto por ByteDance. Permite transformar múltiples temas a partir de un único archivo SVG fuente, ofreciendo una amplia clasificación, un código más ligero y escenarios de uso más flexibles. Su objetivo es construir recursos de iconos de alta calidad, unificados y definibles, para que la mayoría de los diseñadores puedan elegir los iconos con el estilo que mejor se adapte a sus necesidades. Admite la exportación del archivo fuente del icono como código de componente en varios formatos, como React, Vue2, Vue3 y SVG, conectando así el flujo de Design to Code y logrando una integración integral entre producto, desarrollo y diseño para un uso más eficiente. La tecnología de cambio de tema cuenta con 1 patente de invención.

Características de la biblioteca de iconos IconPark:

• Cantidad y clasificación de iconos: incluye más de 2.658 iconos vectoriales de alta calidad. Abarca 29 categorías de iconos, capaces de satisfacer las necesidades de diferentes escenarios.

• Estilos y temas de los iconos: la biblioteca de iconos IconPark admite varios estilos, incluyendo temas de línea, relleno, dos colores y multicolor. Los usuarios pueden transformar fácilmente el tema de los iconos mediante un único archivo SVG fuente, logrando así la unidad y la diversidad de estilos.

• Funciones de personalización: una de las grandes ventajas de IconPark es su potente función de personalización en línea, que utiliza atributos de borde SVG para garantizar la máxima flexibilidad de estilo. Puedes modificar en línea propiedades como el color, el tamaño, el grosor del contorno, el tipo de extremo y el tipo de esquina. Esta capacidad de personalización hace que, en teoría, el número de iconos pueda alcanzar las decenas de miles.

• Soporte técnico y compatibilidad: la biblioteca de iconos IconPark no solo es adecuada para usuarios sin perfil técnico, como diseñadores de UE, UI, gestores de producto y personal de operaciones, sino que también es muy popular entre los desarrolladores técnicos. Admite frameworks de前端 como React y Vue, y ofrece paquetes NPM para facilitar la carga bajo demanda y la invocación del código de los componentes. Los iconos se pueden exportar en formatos SVG, PNG, etc., y son aplicables a proyectos web, móviles y de diseño en general.

• Descarga y uso: los usuarios pueden seleccionar los iconos directamente en el sitio web de IconPark, ajustar el estilo y descargar los formatos SVG o PNG, o copiar fragmentos de código de React o Vue para utilizarlos directamente en sus proyectos. La selección de iconos admite operaciones por lotes, lo que facilita la gestión y la descarga.

• Código abierto y licencia: bajo la licencia de código abierto Apache 2.0, la biblioteca de iconos IconPark es de uso gratuito para particulares, equipos y empresas, tanto en proyectos comerciales como no comerciales, sin coste adicional. Por lo tanto, tanto si eres diseñador como desarrollador, puedes utilizar IconPark en tus proyectos.

Cómo usar la biblioteca de iconos IconPark:

• Búsqueda de iconos: los usuarios pueden seleccionar la categoría de iconos a través del menú izquierdo o utilizar el cuadro de búsqueda para encontrarlos.

• Vista previa de iconos: cada icono cuenta con vista previa, descripción en chino y nombre en inglés.

• Herramientas de ajuste: en el lado derecho se proporcionan herramientas para ajustar el tamaño del icono, el grosor de la línea y el color del estilo.

• Operaciones por lotes: los usuarios pueden marcar iconos para descargarlos por lotes o copiar el código.

• Modos de vista previa: se pueden cambiar diferentes modos de vista previa para observar el efecto del icono.

Usuarios de IconPark

• Profesionales no técnicos como diseñadores de UE, UI, gestores de producto y operaciones

• Desarrolladores de React/Vue/móvil, etc.

• Desarrolladores de sitios web de diseño de terceros/creaciónde sitios web

Ventajas de IconPark

• Alta calidad: ofrece más de 2.600 iconos de alta calidad para uso gratuito. ¡Aquí va un aplauso para nuestros diligentes diseñadores~ o(-v

• Multitema: permite transformar múltiples temas a partir de un único archivo SVG fuente, incluyendo: línea, relleno, dos colores y multicolor, sin necesidad de utilizar archivos SVG para los 4 estilos.

• Exportación de código de componentes multiplataforma: conecta Design to Code. Para los desarrolladores técnicos, permite exportar diferentes bibliotecas de código, satisfaciendo diversos escenarios de desarrollo como React/Vue/SVG/móvil/miniprogramas.

IconPark es mantenido por el equipo de diseño CUX de ByteDance y su código fuente está disponible en GitHub, animando a los usuarios a participar y ofreciendo guías de uso, bibliotecas de código y canales de feedback.

IconPark se dedica a la estandarización y unificación de la aplicación de iconos, ofreciendo contenidos de iconos de alta calidad y gran variedad para satisfacer la capacidad de configurar estilos de iconos por lotes. Al mismo tiempo, permite que múltiples equipos técnicos invoquen recursos de iconos a través de interfaces, haciendo que el uso de iconos sea más sencillo y eficiente.

Repositorio de código abierto de IconPark en GitHub:https://github.com/bytedance/IconPark