IconPark:开源 icon library от ByteDance с поддержкой множества тем 95

IconPark — это библиотека иконок в векторном стиле, разработанная и опубликованная в открытом доступе компанией ByteDance. Она позволяет на основе одного SVG-файла создавать различные темы, обладает богатой категоризацией, более лёгким кодом и гибкими сценариями использования; её цель — предоставить качественные, единообразные и настраиваемые иконочные ресурсы, чтобы большинство дизайнеров могли выбрать подходящий им стиль иконок. Библиотека поддерживает экспорт исходных файлов иконок в виде компонентов для React, Vue2, Vue3 и SVG, обеспечивая сквозную цепочку «Design to Code» и позволяя продукту, разработчикам и дизайнерам эффективно взаимодействовать в едином процессе. Технология смены тем защищена 1 патентом на изобретение.

Особенности библиотеки иконок IconPark:

• Количество и категории иконок: содержит более 2658 высококачественных векторных иконок. Охватывает 29 категорий иконок и способна удовлетворить потребности в различных сценариях.

• Стили и темы иконок: библиотека IconPark поддерживает множество стилей, включая линейный, заливной, двухцветный и многоцветный. Пользователи могут легко менять тему иконок на основе одного SVG-файла, обеспечивая единство и разнообразие стилей.

• Функции настройки: одной из ключевых особенностей IconPark являются мощные возможности онлайн-настройки, при этом максимальная гибкость стилизации достигается за счёт использования атрибутов границ SVG. Вы можете прямо в браузере изменять такие свойства, как цвет, размер, толщина обводки, тип окончаний и тип углов. Благодаря таким возможностям кастомизации теоретическое количество иконок может достигать десятков тысяч.

• Техническая поддержка и совместимость: библиотека IconPark подходит не только для пользователей без технического опыта — дизайнеров UE, UI, продуктовых менеджеров и специалистов по маркетингу, — но и пользуется популярностью среди разработчиков. Поддерживаются фронтенд-фреймворки React, Vue и другие, предоставляются NPM-пакеты для удобной загрузки по требованию и вызова кода компонентов. Иконки можно экспортировать в форматах SVG, PNG и других, что подходит для веб-проектов, мобильных приложений и любых дизайнерских задач.

• Загрузка и использование: пользователи могут прямо на сайте IconPark выбрать иконку, настроить стиль и скачать её в формате SVG или PNG, либо скопировать фрагмент кода для React или Vue и сразу использовать в своём проекте. Поддерживается пакетный выбор иконок, что удобно для управления и загрузки.

• Открытый исходный код и лицензия: библиотека распространяется по лицензии Apache 2.0 и бесплатно доступна для использования частными лицами, командами и компаниями как в коммерческих, так и в некоммерческих целях без какой-либо дополнительной платы. Поэтому независимо от того, дизайнер вы или разработчик, вы можете использовать IconPark в своих проектах.

Как пользоваться библиотекой иконок IconPark:

• Поиск иконок: пользователи могут выбрать категорию иконок в меню слева или воспользоваться строкой поиска.

• Просмотр иконок: каждая иконка имеет предварительный просмотр, описание на китайском и английском названии.

• Инструменты настройки: справа доступны инструменты для изменения размера иконки, толщины линий и цвета стиля.

• Пакетные операции: пользователи могут отмечать иконки для пакетной загрузки или копирования кода.

• Режим предварительного просмотра: можно переключать различные режимы просмотра, чтобы увидеть, как выглядит иконка.

Пользователи IconPark

• Специалисты без технического опыта: дизайнеры UE, UI, продакт-менеджеры, маркетологи и др.

• Разработчики на React/Vue, мобильной разработке и др.

• Разработчики сторонних дизайн-сайтов / конструкторов сайтов

Преимущества IconPark

• Высокое качество: предоставляется более 2600+ качественных иконок, бесплатных для использования. Огромная благодарность нашим трудолюбивым дизайнерам~ o(-v

• Множество тем: на основе одного SVG-файла можно создавать различные темы, включая линейную, заливную, двухцветную и многоцветную, без необходимости использовать 4 разных SVG-файла со стилями.

• Кроссплатформенный экспорт кода компонентов: реализована цепочка Design to Code — для технических специалистов доступен экспорт под различные кодовые базы, что удовлетворяет сценарии разработки на React/Vue/SVG/мобильных платформах/мини-приложениях и др.

IconPark поддерживается командой дизайнеров CUX компании ByteDance, исходный код открыт на GitHub. Пользователи приглашаются к участию, для них предоставляются руководства, репозитории кода и каналы обратной связи.

IconPark стремится к стандартизации и единообразию использования иконок, предоставляет богатый выбор качественных иконок и возможность массовой настройки их стилей; одновременно обеспечивает возможность вызова иконочных ресурсов через API для различных технических команд, делая использование иконок более простым и эффективным.

Репозиторий IconPark на GitHub: https://github.com/bytedance/IconPark