Иконки Font Awesome 6 Solid
fa6-solid · 1 402 иконки · автор: Dave Gandy · CC-BY-4.0 · одноцветные · сетка 32 px · Обновлено
Иконки Font Awesome 6 Solid — бесплатный набор иконок с открытым кодом: 1 402 SVG-иконки от Dave Gandy, выпущенный под лицензией CC BY 4.0. Иконки одноцветные: они наследуют цвет текста (currentColor), и их цвет можно менять через CSS. Они нарисованы по сетке 32 px и чётко масштабируются как SVG.
Дизайн-спецификация: Иконки Font Awesome 6 Solid
- залитый
- монохромный
Правила рисования этого набора, измеренные по его SVG-файлам. Используйте их, чтобы создавать новые иконки в том же стиле.
| Холст | 512 × 512 · 35% иконок |
|---|---|
| viewBox | 0 0 512 512 |
| Область рисования | Весь холст, без отступов |
| Стиль рисования | Залитые фигуры |
| Радиус скругления | 32 |
| Цвета | Один цвет (currentColor), меняется через CSS |
| Координаты | До 2 знаков после запятой |
| Прямые линии | 59% горизонтальные или вертикальные, 5% под 45° |
| Кривые | 60% команд рисования |
| Симметрия | 39% иконок симметричны слева направо |
| Элементов на иконку | 1 |
| Команд рисования на иконку | 30 |
Измерено по 62 иконкам набора.
Генерация иконок с помощью ИИ
Лицензия разрешает создавать новые иконки на основе этого набора.
- Укажите авторов оригинала.
Строка атрибуции: Based on Font Awesome 6 Solid by Dave Gandy, licensed under CC BY 4.0. https://creativecommons.org/licenses/by/4.0/
Стайлгайд для промпта LLM (на английском)
Вставьте его в промпт вместе с несколькими иконками из набора и укажите, какую иконку нужно нарисовать.
You draw new icons for the "Font Awesome 6 Solid" icon set (Iconify prefix "fa6-solid") by Dave Gandy.
Style: filled, solid, monochrome.
Iconify describes the set as: Precise Shapes.
Canvas
- Root: <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">.
- Draw edge to edge: icons use the full canvas with no padding.
- A typical icon's bounding box covers 100% of the canvas.
Drawing
- Filled icons: draw closed filled shapes; don't use strokes.
- Round corners with a radius of about 32.
Geometry
- Coordinates are free-form; write at most 2 decimals.
- Straight lines: 59% horizontal or vertical, 5% at 45 degrees.
- About 60% of drawing commands are curves or arcs.
- Keep it simple: about 1 element and 30 drawing commands per icon.
- Elements used by the set: path.
Color
- Monochrome: paint with currentColor only, never a fixed color.
Output
- Reply with one complete <svg> element and nothing else: no comments, <title>, ids or scripts.
- Match the examples: reuse their shapes for shared parts (arrow heads, people, documents, badges).О наборе Иконки Font Awesome 6 Solid
Набор разделён на 73 категории, в том числе предметы (167), карты (87), интерфейсы (86) и медицина (56).
Популярные Иконки Font Awesome 6 Solid: location pin, gem, folder, mound, toggle on и table columns.
Откройте любую иконку, чтобы скопировать её как SVG, JSX, Vue, Svelte, Solid, Astro или CSS или скачать в SVG или PNG. Иконки Font Awesome 6 Solid выпущены под лицензией CC BY 4.0, которая разрешает использование в личных и коммерческих проектах при условии указания автора. Примечание: авторы больше не поддерживают этот набор активно.
Иконки Font Awesome 6 Solid по категориям
Иконки Предметы (167)
Иконки Карты (87)
Иконки Интерфейсы (86)
Иконки Медицина (56)
Иконки Бизнес (54)
Иконки Статус (54)
Иконки Редакторы (51)
Иконки Стрелки (38)
Иконки Дизайн (33)
Иконки Пользователи и люди (32)
Иконки Наука (26)
Иконки Связь (25)
Как использовать Иконки Font Awesome 6 Solid
Все иконки на этой странице работают в любом фреймворке. В примерах используется fa6-solid:location-pin; откройте иконку, чтобы скопировать её код в SVG, JSX, Vue, Svelte, Solid, Astro или CSS. Советы по размеру, цвету и доступности — в руководстве как использовать SVG-иконки.
React
import { Icon } from "@iconify/react";
<Icon icon="fa6-solid:location-pin" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="fa6-solid:location-pin" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="fa6-solid:location-pin" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[fa6-solid--location-pin]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/fa6-solid -->
<div class="i-fa6-solid:location-pin"></div>Веб-компонент
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="fa6-solid:location-pin"></iconify-icon>Изображение HTML
<img src="https://iconyz.com/api/public/svg/fa6-solid/location-pin.svg" alt="Иконка Location Pin" width="24" height="24">Вопросы и ответы: Иконки Font Awesome 6 Solid
Можно ли бесплатно использовать Иконки Font Awesome 6 Solid в коммерческих проектах?
Да. Иконки Font Awesome 6 Solid выпущены под лицензией CC BY 4.0, которая разрешает использование в личных и коммерческих проектах при условии указания автора.
Сколько иконок в наборе Иконки Font Awesome 6 Solid?
В наборе Иконки Font Awesome 6 Solid 1 402 иконки в 73 категориях.
Какая лицензия у набора Иконки Font Awesome 6 Solid?
Иконки Font Awesome 6 Solid распространяются по лицензии CC BY 4.0. Полный текст лицензии доступен по адресу https://creativecommons.org/licenses/by/4.0/.
Кто создал Иконки Font Awesome 6 Solid?
Автор набора Иконки Font Awesome 6 Solid — Dave Gandy.
Как использовать Иконки Font Awesome 6 Solid в React?
Установите @iconify/react и отрисуйте <Icon icon="fa6-solid:location-pin" /> или откройте любую иконку на этой странице и скопируйте её как отдельный React-компонент.
Какого размера Иконки Font Awesome 6 Solid?
Иконки Font Awesome 6 Solid нарисованы по сетке 32 px. Как SVG они масштабируются до любого размера без потери качества.