Иконки Firefox OS Emoji
fxemoji · 1 034 иконки · автор: Mozilla · Apache-2.0 · многоцветные · сетка 32 px · Обновлено
Иконки Firefox OS Emoji — бесплатный набор иконок с открытым кодом: 1 034 SVG-иконки от Mozilla, выпущенный под лицензией Apache 2.0. Иконки многоцветные, поэтому сохраняют свои цвета в любом размере. Они нарисованы по сетке 32 px и чётко масштабируются как SVG.
Дизайн-спецификация: Иконки Firefox OS Emoji
- залитый
- многоцветные
Правила рисования этого набора, измеренные по его SVG-файлам. Используйте их, чтобы создавать новые иконки в том же стиле.
| Холст | 512 × 512 |
|---|---|
| viewBox | 0 0 512 512 |
| Область рисования | 507.34 × 507.34, отступ 2.33 |
| Стиль рисования | Залитые фигуры |
| Радиус скругления | 2.25 |
| Цвета | Около 4 цветов на иконку |
| Координаты | До 3 знаков после запятой |
| Прямые линии | 65% горизонтальные или вертикальные, 4% под 45° |
| Кривые | 63% команд рисования |
| Симметрия | 34% иконок симметричны слева направо |
| Элементов на иконку | 4.3 |
| Команд рисования на иконку | 115 |
Измерено по 62 иконкам набора.
Генерация иконок с помощью ИИ
Лицензия разрешает создавать новые иконки на основе этого набора.
- Укажите авторов оригинала.
Строка атрибуции: Based on Firefox OS Emoji by Mozilla, licensed under Apache 2.0. https://mozilla.github.io/fxemoji/LICENSE.md
Стайлгайд для промпта LLM (на английском)
Вставьте его в промпт вместе с несколькими иконками из набора и укажите, какую иконку нужно нарисовать.
You draw new icons for the "Firefox OS Emoji" icon set (Iconify prefix "fxemoji") by Mozilla.
Style: filled, solid, multicolor.
Canvas
- Root: <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">.
- Keep the drawing inside a 507.34x507.34 live area: about 2.33 units of padding on every side (never less than 0).
- A typical icon's bounding box covers 85% of the canvas.
Drawing
- Filled icons: draw closed filled shapes; don't use strokes.
- Round corners with a radius of about 2.25.
Geometry
- Coordinates are free-form; write at most 3 decimals.
- Straight lines: 65% horizontal or vertical, 4% at 45 degrees.
- About 63% of drawing commands are curves or arcs.
- Keep it simple: about 4 elements and 115 drawing commands per icon.
- Elements used by the set: path, ellipse, circle.
Color
- Multicolor, about 4 colors per icon. Use this palette: #2b3b47, #ff473e, #ffb636, #132028, #ffd469, #ffffff, #597b91, #d1cfc3, #f9f9f7, #2b5770, #bfbcaf, #e8e8e8.
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).О наборе Иконки Firefox OS Emoji
Набор разделён на 6 категорий, в том числе предметы (345), люди (214), символы (210) и природа (137).
Популярные Иконки Firefox OS Emoji: foxweary, loveletter, openlock, blackdiamondsuit, speaker и screen.
Откройте любую иконку, чтобы скопировать её как SVG, JSX, Vue, Svelte, Solid, Astro или CSS или скачать в SVG или PNG. Иконки Firefox OS Emoji выпущены под лицензией Apache 2.0, которая разрешает использование в личных и коммерческих проектах.
Иконки Firefox OS Emoji по категориям
Иконки Предметы (345)
Иконки Люди (214)
Иконки Символы (210)
Иконки Природа (137)
Иконки Места (106)
Иконки Флаги (22)
Как использовать Иконки Firefox OS Emoji
Все иконки на этой странице работают в любом фреймворке. В примерах используется fxemoji:foxweary; откройте иконку, чтобы скопировать её код в SVG, JSX, Vue, Svelte, Solid, Astro или CSS. Советы по размеру, цвету и доступности — в руководстве как использовать SVG-иконки.
React
import { Icon } from "@iconify/react";
<Icon icon="fxemoji:foxweary" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="fxemoji:foxweary" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="fxemoji:foxweary" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[fxemoji--foxweary]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/fxemoji -->
<div class="i-fxemoji:foxweary"></div>Веб-компонент
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="fxemoji:foxweary"></iconify-icon>Изображение HTML
<img src="https://iconyz.com/api/public/svg/fxemoji/foxweary.svg" alt="Иконка Foxweary" width="24" height="24">Вопросы и ответы: Иконки Firefox OS Emoji
Можно ли бесплатно использовать Иконки Firefox OS Emoji в коммерческих проектах?
Да. Иконки Firefox OS Emoji выпущены под лицензией Apache 2.0, которая разрешает использование в личных и коммерческих проектах.
Сколько иконок в наборе Иконки Firefox OS Emoji?
В наборе Иконки Firefox OS Emoji 1 034 иконки в 6 категориях.
Какая лицензия у набора Иконки Firefox OS Emoji?
Иконки Firefox OS Emoji распространяются по лицензии Apache 2.0. Полный текст лицензии доступен по адресу https://mozilla.github.io/fxemoji/LICENSE.md.
Кто создал Иконки Firefox OS Emoji?
Автор набора Иконки Firefox OS Emoji — Mozilla.
Как использовать Иконки Firefox OS Emoji в React?
Установите @iconify/react и отрисуйте <Icon icon="fxemoji:foxweary" /> или откройте любую иконку на этой странице и скопируйте её как отдельный React-компонент.
Какого размера Иконки Firefox OS Emoji?
Иконки Firefox OS Emoji нарисованы по сетке 32 px. Как SVG они масштабируются до любого размера без потери качества.