Иконки Streamline Block
streamline-block · 300 иконок · автор: Streamline · CC-BY-4.0 · одноцветные · сетка 16 px · Обновлено
Иконки Streamline Block — бесплатный набор иконок с открытым кодом: 300 SVG-иконок от Streamline, выпущенный под лицензией CC BY 4.0. Иконки одноцветные: они наследуют цвет текста (currentColor), и их цвет можно менять через CSS. Они нарисованы по сетке 16 px и чётко масштабируются как SVG.
Дизайн-спецификация: Иконки Streamline Block
- залитый
- монохромный
Правила рисования этого набора, измеренные по его SVG-файлам. Используйте их, чтобы создавать новые иконки в том же стиле.
| Холст | 24 × 24 |
|---|---|
| viewBox | 0 0 24 24 |
| Область рисования | Весь холст, без отступов |
| Стиль рисования | Залитые фигуры |
| Радиус скругления | 3 |
| Цвета | Один цвет (currentColor), меняется через CSS |
| Координаты | До 3 знаков после запятой |
| Прямые линии | 73% горизонтальные или вертикальные, 23% под 45° |
| Кривые | 28% команд рисования |
| Симметрия | 39% иконок симметричны слева направо |
| Элементов на иконку | 1.2 |
| Команд рисования на иконку | 9 |
Измерено по 64 иконкам набора.
Генерация иконок с помощью ИИ
Лицензия разрешает создавать новые иконки на основе этого набора.
- Укажите авторов оригинала.
Строка атрибуции: Based on Streamline Block by Streamline, licensed under CC BY 4.0. https://creativecommons.org/licenses/by/4.0/
Стайлгайд для промпта LLM (на английском)
Вставьте его в промпт вместе с несколькими иконками из набора и укажите, какую иконку нужно нарисовать.
You draw new icons for the "Streamline Block" icon set (Iconify prefix "streamline-block") by Streamline.
Style: filled, solid, monochrome.
Iconify describes the set as: Precise Shapes.
Canvas
- Root: <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">.
- Draw edge to edge: icons use the full canvas with no padding.
- A typical icon's bounding box covers 44% of the canvas.
Drawing
- Filled icons: draw closed filled shapes; don't use strokes.
- Round corners with a radius of about 3.
Geometry
- Coordinates are free-form; write at most 3 decimals.
- Straight lines: 73% horizontal or vertical, 23% at 45 degrees.
- About 28% of drawing commands are curves or arcs.
- Keep it simple: about 1 element and 9 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).О наборе Иконки Streamline Block
Набор разделён на 6 категорий, в том числе основы интерфейса (159), стрелки (56), досуг (26) и технологии (23).
Популярные Иконки Streamline Block: other ui chat, content write, content bookmark, nature lightning, control buttons play и basic ui remove.
Откройте любую иконку, чтобы скопировать её как SVG, JSX, Vue, Svelte, Solid, Astro или CSS или скачать в SVG или PNG. Иконки Streamline Block выпущены под лицензией CC BY 4.0, которая разрешает использование в личных и коммерческих проектах при условии указания автора.
Иконки Streamline Block по категориям
Иконки Основы интерфейса (159)
Иконки Стрелки (56)
Иконки Досуг (26)
Иконки Технологии (23)
Иконки Торговля (18)
Иконки Благополучие (18)
Как использовать Иконки Streamline Block
Все иконки на этой странице работают в любом фреймворке. В примерах используется streamline-block:other-ui-chat; откройте иконку, чтобы скопировать её код в SVG, JSX, Vue, Svelte, Solid, Astro или CSS. Советы по размеру, цвету и доступности — в руководстве как использовать SVG-иконки.
React
import { Icon } from "@iconify/react";
<Icon icon="streamline-block:other-ui-chat" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="streamline-block:other-ui-chat" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="streamline-block:other-ui-chat" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[streamline-block--other-ui-chat]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/streamline-block -->
<div class="i-streamline-block:other-ui-chat"></div>Веб-компонент
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="streamline-block:other-ui-chat"></iconify-icon>Изображение HTML
<img src="https://iconyz.com/api/public/svg/streamline-block/other-ui-chat.svg" alt="Иконка Other Ui Chat" width="24" height="24">Вопросы и ответы: Иконки Streamline Block
Можно ли бесплатно использовать Иконки Streamline Block в коммерческих проектах?
Да. Иконки Streamline Block выпущены под лицензией CC BY 4.0, которая разрешает использование в личных и коммерческих проектах при условии указания автора.
Сколько иконок в наборе Иконки Streamline Block?
В наборе Иконки Streamline Block 300 иконок в 6 категориях.
Какая лицензия у набора Иконки Streamline Block?
Иконки Streamline Block распространяются по лицензии CC BY 4.0. Полный текст лицензии доступен по адресу https://creativecommons.org/licenses/by/4.0/.
Кто создал Иконки Streamline Block?
Автор набора Иконки Streamline Block — Streamline.
Как использовать Иконки Streamline Block в React?
Установите @iconify/react и отрисуйте <Icon icon="streamline-block:other-ui-chat" /> или откройте любую иконку на этой странице и скопируйте её как отдельный React-компонент.
Какого размера Иконки Streamline Block?
Иконки Streamline Block нарисованы по сетке 16 px. Как SVG они масштабируются до любого размера без потери качества.