ICONYZ
Português (Brasil)

Ultimate color icons

streamline-ultimate-color · 998 ícones · de Streamline · CC-BY-4.0 · multicolorido · grade de 24px · Atualizado em

Ultimate color icons é uma coleção de ícones grátis e de código aberto com 998 ícones SVG de Streamline, publicada sob a licença CC BY 4.0. Os ícones são multicoloridos, então mantêm as próprias cores em qualquer tamanho. Eles são desenhados em uma grade de 24px e escalam sem perda de qualidade como SVG.

Especificações de design de Ultimate color icons

  • contorno e preenchido
  • multicolorido
  • arredondado

As regras de desenho desta coleção, medidas a partir dos seus arquivos SVG. Use-as para criar novos ícones que combinem com ela.

Tela24 × 24
viewBox0 0 24 24
Área de desenho23 × 23, margem de 0.5
Estilo de desenhoMistura de contorno e preenchimento
Espessura do traço1
Pontas da linhaArredondado
Junções da linhaArredondado
Raio dos cantos1
CoresCerca de 4 cores por ícone
CoordenadasAté 3 casas decimais
Linhas retas68% horizontais ou verticais, 13% a 45°
Curvas56% dos comandos de desenho
Simetria40% dos ícones são simétricos da esquerda para a direita
Elementos por ícone6.1
Comandos de desenho por ícone41

Medido a partir de 62 ícones desta coleção.

Geração de ícones com IA

A licença permite criar novos ícones derivados desta coleção.

  • Dê crédito aos autores originais.

Texto de atribuição: Based on Ultimate color icons by Streamline, licensed under CC BY 4.0. https://creativecommons.org/licenses/by/4.0/

Guia de estilo para um prompt de LLM (em inglês)

Cole-o em um prompt com alguns ícones desta coleção e depois diga qual ícone você quer.

You draw new icons for the "Ultimate color icons" icon set (Iconify prefix "streamline-ultimate-color") by Streamline.
Style: mixed outline and fill, multicolor, rounded.

Canvas
- Root: <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">.
- Keep the drawing inside a 23x23 live area: about 0.5 units of padding on every side (never less than 0.29).
- A typical icon's bounding box covers 85% of the canvas.

Drawing
- Icons mix strokes and filled shapes (mixed 92%, stroke 6%, fill 2%).
- stroke-width="1".
- stroke-linecap="round", stroke-linejoin="round".
- Wrap the shapes in <g fill="none">, as 92% of the set does.
- Round corners with a radius of about 1.

Geometry
- Coordinates are free-form; write at most 3 decimals.
- Straight lines: 68% horizontal or vertical, 13% at 45 degrees.
- About 56% of drawing commands are curves or arcs.
- Prefer left-right symmetric shapes (40% of icons are symmetric).
- Keep it simple: about 6 elements and 41 drawing commands per icon.
- Elements used by the set: path, g, clippath, defs, mask.

Color
- Multicolor, about 4 colors per icon. Use this palette: #191919, #e3e3e3, #66e1ff, #ffef5e, #ffffff, #c2f3ff, #ff808c, #fff9bf, gray, #ffbfc5, #ffdda1, #b2b2b2.

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).
Página 1 de 11
Ícone ab-testing-monitors
ab-testing-monitors
Ícone accounting-bill-stack-1
accounting-bill-stack-1
Ícone accounting-calculator-1
accounting-calculator-1
Ícone accounting-coins
accounting-coins
Ícone add-circle-bold
add-circle-bold
Ícone adobe-logo
adobe-logo
Ícone ads-window
ads-window
Ícone adventure-car-truck-1
adventure-car-truck-1
Ícone aircraft-chopper-1
aircraft-chopper-1
Ícone aircraft-hot-air-balloon-2
aircraft-hot-air-balloon-2
Ícone airplane-mode
airplane-mode
Ícone alarm-bell-check-1
alarm-bell-check-1
Ícone alarm-bell-ring
alarm-bell-ring
Ícone alarm-bell-sleep-1
alarm-bell-sleep-1
Ícone align-center
align-center
Ícone align-middle
align-middle
Ícone align-top
align-top
Ícone allowances-no-photos
allowances-no-photos
Ícone allowances-no-talking
allowances-no-talking
Ícone allowances-smoking
allowances-smoking
Ícone amazon-logo-1
amazon-logo-1
Ícone amazon-web-services-logo
amazon-web-services-logo
Ícone ambulance-call
ambulance-call
Ícone american-football-helmet
american-football-helmet
Ícone amusement-park-balloon
amusement-park-balloon
Ícone amusement-park-castle
amusement-park-castle
Ícone amusement-park-electric-cars
amusement-park-electric-cars
Ícone amusement-park-ferris-wheel
amusement-park-ferris-wheel
Ícone analytics-bars-3d
analytics-bars-3d
Ícone analytics-board-graph-line
analytics-board-graph-line
Ícone analytics-graph-lines
analytics-graph-lines
Ícone analytics-mountain
analytics-mountain
Ícone analytics-net
analytics-net
Ícone analytics-pie-2
analytics-pie-2
Ícone android-1
android-1
Ícone animal-products-egg
animal-products-egg
Ícone antenna
antenna
Ícone app-window-bookmark
app-window-bookmark
Ícone app-window-clock
app-window-clock
Ícone app-window-cloud
app-window-cloud
Ícone app-window-code
app-window-code
Ícone app-window-pie-chart
app-window-pie-chart
Ícone app-window-text
app-window-text
Ícone app-window-two
app-window-two
Ícone apple-logo
apple-logo
Ícone archive-books
archive-books
Ícone archive-locker
archive-locker
Ícone arrange-letter
arrange-letter
Ícone arrange-number
arrange-number
Ícone arrow-button-circle-left
arrow-button-circle-left
Ícone arrow-button-right-1
arrow-button-right-1
Ícone arrow-button-up
arrow-button-up
Ícone arrow-dot-corner-left-1
arrow-dot-corner-left-1
Ícone arrow-double-down-1
arrow-double-down-1
Ícone arrow-double-up
arrow-double-up
Ícone arrow-down-2
arrow-down-2
Ícone arrow-rectangle-down-2
arrow-rectangle-down-2
Ícone arrow-right
arrow-right
Ícone arrow-thick-circle-left-1
arrow-thick-circle-left-1
Ícone arrow-thick-left-3
arrow-thick-left-3
Ícone arrow-thick-right-bottom-corner-3
arrow-thick-right-bottom-corner-3
Ícone arrow-thick-up-4
arrow-thick-up-4
Ícone astronomy-planet-ring
astronomy-planet-ring
Ícone athletics-javelin-throwing
athletics-javelin-throwing
Ícone athletics-running-1
athletics-running-1
Ícone athletics-team-running
athletics-team-running
Ícone ati-logo
ati-logo
Ícone attachment
attachment
Ícone audio-file
audio-file
Ícone audio-file-mp3
audio-file-mp3
Ícone audio-file-sync
audio-file-sync
Ícone award-badge-star
award-badge-star
Ícone award-medal-4
award-medal-4
Ícone award-ribbon-star-1
award-ribbon-star-1
Ícone award-trophy-1
award-trophy-1
Ícone bandage-leg
bandage-leg
Ícone barbecue-grill
barbecue-grill
Ícone barcode
barcode
Ícone baseball-bat-ball
baseball-bat-ball
Ícone beacon-wireless-remote
beacon-wireless-remote
Ícone beer-glass
beer-glass
Ícone beer-opener-1
beer-opener-1
Ícone behance-logo-1
behance-logo-1
Ícone bicycle
bicycle
Ícone bin-1
bin-1
Ícone bing-logo
bing-logo
Ícone binocular
binocular
Ícone blackberry-logo
blackberry-logo
Ícone blogger-logo
blogger-logo
Ícone blood-drop
blood-drop
Ícone blood-drops-positive
blood-drops-positive
Ícone bluetooth-transfer
bluetooth-transfer
Ícone board-game-dice-1
board-game-dice-1
Ícone board-game-dice-2
board-game-dice-2
Ícone board-game-jenga
board-game-jenga
Ícone board-game-ludo
board-game-ludo

Sobre Ultimate color icons

A coleção está organizada em 31 categorias, entre elas interface essencial (148), negócios e produtos (50), computadores, dispositivos e eletrônicos (50) e saúde e beleza (50).

Entre os Ultimate color icons mais populares estão touch up, like, download bottom, power button, move expand vertical e keyboard asterisk 3.

Abra qualquer ícone para copiá-lo como SVG, JSX, Vue, Svelte, Solid, Astro ou CSS, ou baixe em SVG ou PNG. Ultimate color icons são publicados sob a licença CC BY 4.0, que permite o uso em projetos pessoais e comerciais desde que você dê crédito ao autor.

Ultimate color icons por categoria

Como usar Ultimate color icons

Todos os ícones desta página funcionam em qualquer framework. Os exemplos usam streamline-ultimate-color:touch-up; abra um ícone para copiar o código exato em SVG, JSX, Vue, Svelte, Solid, Astro ou CSS. Para dicas de tamanho, cor e acessibilidade, leia como usar ícones SVG.

React

import { Icon } from "@iconify/react";

<Icon icon="streamline-ultimate-color:touch-up" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="streamline-ultimate-color:touch-up" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="streamline-ultimate-color:touch-up" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[streamline-ultimate-color--touch-up]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/streamline-ultimate-color -->
<div class="i-streamline-ultimate-color:touch-up"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="streamline-ultimate-color:touch-up"></iconify-icon>

Imagem HTML

<img src="https://iconyz.com/api/public/svg/streamline-ultimate-color/touch-up.svg" alt="Ícone Touch Up" width="24" height="24">

Perguntas frequentes sobre Ultimate color icons

Os Ultimate color icons são grátis para uso comercial?

Sim. Ultimate color icons são publicados sob a licença CC BY 4.0, que permite o uso em projetos pessoais e comerciais desde que você dê crédito ao autor.

Quantos ícones tem Ultimate color icons?

Ultimate color icons tem 998 ícones em 31 categorias.

Qual é a licença dos Ultimate color icons?

Ultimate color icons são distribuídos sob CC BY 4.0. O texto completo da licença está disponível em https://creativecommons.org/licenses/by/4.0/.

Quem criou Ultimate color icons?

Ultimate color icons são criados por Streamline.

Como usar Ultimate color icons no React?

Instale @iconify/react e renderize <Icon icon="streamline-ultimate-color:touch-up" />, ou abra qualquer ícone desta página e copie-o como um componente React independente.

Qual é o tamanho dos Ultimate color icons?

Ultimate color icons são desenhados em uma grade de 24px. Por serem SVG, escalam para qualquer tamanho sem perder qualidade.

Coleções semelhantes