ICONYZ
Português (Brasil)

Plump color icons

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

Plump color icons é uma coleção de ícones grátis e de código aberto com 1.000 í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 Plump 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.

Tela48 × 48
viewBox0 0 48 48
Área de desenho45.02 × 45.02, margem de 1.49
Estilo de desenhoMistura de contorno e preenchimento
Espessura do traço3
Pontas da linhaArredondado
Junções da linhaArredondado
Raio dos cantos2
CoresCerca de 2 cores por ícone
CoordenadasAté 3 casas decimais
Linhas retas49% horizontais ou verticais, 12% a 45°
Curvas85% dos comandos de desenho
Simetria30% dos ícones são simétricos da esquerda para a direita
Elementos por ícone3.3
Comandos de desenho por ícone40

Medido a partir de 64 í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 Plump 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 "Plump color icons" icon set (Iconify prefix "streamline-plump-color") by Streamline.
Style: mixed outline and fill, multicolor, rounded.
Iconify describes the set as: Uses Stroke.

Canvas
- Root: <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">.
- Keep the drawing inside a 45.02x45.02 live area: about 1.49 units of padding on every side (never less than 0.15).
- A typical icon's bounding box covers 88% of the canvas.

Drawing
- Icons mix strokes and filled shapes (fill 52%, mixed 47%, stroke 2%).
- stroke-width="3".
- stroke-linecap="round", stroke-linejoin="round".
- Round corners with a radius of about 2.

Geometry
- Coordinates are free-form; write at most 3 decimals.
- Straight lines: 49% horizontal or vertical, 12% at 45 degrees.
- About 85% of drawing commands are curves or arcs.
- Keep it simple: about 3 elements and 40 drawing commands per icon.
- Elements used by the set: path, g.

Color
- Multicolor, about 2 colors per icon. Use this palette: #8fbffa, #2859c5, #ffffff.

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 3d-coordinate-axis
3d-coordinate-axis
Ícone 3d-coordinate-axis-flat
3d-coordinate-axis-flat
Ícone add-bell-notification
add-bell-notification
Ícone add-bell-notification-flat
add-bell-notification-flat
Ícone add-layer-2
add-layer-2
Ícone add-layer-2-flat
add-layer-2-flat
Ícone ai-edit-robot
ai-edit-robot
Ícone ai-edit-robot-flat
ai-edit-robot-flat
Ícone ai-generate-portrait-image-spark
ai-generate-portrait-image-spark
Ícone ai-generate-portrait-image-spark-flat
ai-generate-portrait-image-spark-flat
Ícone ai-generate-variation-spark
ai-generate-variation-spark
Ícone ai-generate-variation-spark-flat
ai-generate-variation-spark-flat
Ícone ai-generate-voice-robot-2
ai-generate-voice-robot-2
Ícone ai-generate-voice-robot-2-flat
ai-generate-voice-robot-2-flat
Ícone ai-science-robot
ai-science-robot
Ícone ai-science-robot-flat
ai-science-robot-flat
Ícone ai-technology-spark
ai-technology-spark
Ícone ai-technology-spark-flat
ai-technology-spark-flat
Ícone airplane-disabled
airplane-disabled
Ícone airplane-disabled-flat
airplane-disabled-flat
Ícone airplane-enabled
airplane-enabled
Ícone airplane-enabled-flat
airplane-enabled-flat
Ícone airport-security
airport-security
Ícone airport-security-flat
airport-security-flat
Ícone alien
alien
Ícone alien-flat
alien-flat
Ícone align-object-left
align-object-left
Ícone align-object-left-flat
align-object-left-flat
Ícone align-right
align-right
Ícone align-right-flat
align-right-flat
Ícone align-selection
align-selection
Ícone align-selection-flat
align-selection-flat
Ícone ampersand
ampersand
Ícone ampersand-flat
ampersand-flat
Ícone announcement-megaphone
announcement-megaphone
Ícone announcement-megaphone-flat
announcement-megaphone-flat
Ícone application-add
application-add
Ícone application-add-flat
application-add-flat
Ícone archive-box
archive-box
Ícone archive-box-flat
archive-box-flat
Ícone arrow-cursor-1
arrow-cursor-1
Ícone arrow-cursor-1-flat
arrow-cursor-1-flat
Ícone arrow-cursor-move
arrow-cursor-move
Ícone arrow-cursor-move-flat
arrow-cursor-move-flat
Ícone arrow-curvy-both-direction-2
arrow-curvy-both-direction-2
Ícone arrow-curvy-both-direction-2-flat
arrow-curvy-both-direction-2-flat
Ícone arrow-diagonal-2
arrow-diagonal-2
Ícone arrow-diagonal-2-flat
arrow-diagonal-2-flat
Ícone arrow-expand
arrow-expand
Ícone arrow-expand-flat
arrow-expand-flat
Ícone arrow-right-circle-1
arrow-right-circle-1
Ícone arrow-right-circle-1-flat
arrow-right-circle-1-flat
Ícone arrow-right-circle-2
arrow-right-circle-2
Ícone arrow-right-circle-2-flat
arrow-right-circle-2-flat
Ícone arrow-roadmap
arrow-roadmap
Ícone arrow-roadmap-flat
arrow-roadmap-flat
Ícone arrow-transfer-horizontal-square
arrow-transfer-horizontal-square
Ícone arrow-transfer-horizontal-square-flat
arrow-transfer-horizontal-square-flat
Ícone arrow-turn-down-large
arrow-turn-down-large
Ícone arrow-turn-down-large-flat
arrow-turn-down-large-flat
Ícone arrow-up-4
arrow-up-4
Ícone arrow-up-4-flat
arrow-up-4-flat
Ícone ascending-alphabetical-order
ascending-alphabetical-order
Ícone ascending-alphabetical-order-flat
ascending-alphabetical-order-flat
Ícone atom
atom
Ícone atom-flat
atom-flat
Ícone attribution
attribution
Ícone attribution-flat
attribution-flat
Ícone auto-flash
auto-flash
Ícone auto-flash-flat
auto-flash-flat
Ícone bag
bag
Ícone bag-flat
bag-flat
Ícone bag-suitcase-4
bag-suitcase-4
Ícone bag-suitcase-4-flat
bag-suitcase-4-flat
Ícone ball
ball
Ícone ball-flat
ball-flat
Ícone balloon
balloon
Ícone balloon-flat
balloon-flat
Ícone battery-charging
battery-charging
Ícone battery-charging-flat
battery-charging-flat
Ícone battery-low-3
battery-low-3
Ícone battery-low-3-flat
battery-low-3-flat
Ícone beach
beach
Ícone beach-flat
beach-flat
Ícone beer-pitch
beer-pitch
Ícone beer-pitch-flat
beer-pitch-flat
Ícone bell
bell
Ícone bell-flat
bell-flat
Ícone bicycle-bike
bicycle-bike
Ícone bicycle-bike-flat
bicycle-bike-flat
Ícone binoculars
binoculars
Ícone binoculars-flat
binoculars-flat
Ícone bitcoin-circle-1
bitcoin-circle-1
Ícone bitcoin-circle-1-flat
bitcoin-circle-1-flat
Ícone block-1
block-1
Ícone block-1-flat
block-1-flat

Sobre Plump color icons

A coleção está organizada em 16 categorias, entre elas interface essencial (420), mapas e viagens (100), computadores e dispositivos (90) e dinheiro e compras (78).

Entre os Plump color icons mais populares estão tune adjust volume, pacman flat, web, sad face, location pin flat e smiley indiferent flat.

Abra qualquer ícone para copiá-lo como SVG, JSX, Vue, Svelte, Solid, Astro ou CSS, ou baixe em SVG ou PNG. Plump 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.

Plump color icons por categoria

Como usar Plump color icons

Todos os ícones desta página funcionam em qualquer framework. Os exemplos usam streamline-plump-color:tune-adjust-volume; 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-plump-color:tune-adjust-volume" width="24" />

Vue

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

<template>
  <Icon icon="streamline-plump-color:tune-adjust-volume" width="24" />
</template>

Svelte

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

<Icon icon="streamline-plump-color:tune-adjust-volume" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[streamline-plump-color--tune-adjust-volume]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/streamline-plump-color -->
<div class="i-streamline-plump-color:tune-adjust-volume"></div>

Web component

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

<iconify-icon icon="streamline-plump-color:tune-adjust-volume"></iconify-icon>

Imagem HTML

<img src="https://icons.sys.karaztherapy.ma/api/public/svg/streamline-plump-color/tune-adjust-volume.svg" alt="Ícone Tune Adjust Volume" width="24" height="24">

Perguntas frequentes sobre Plump color icons

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

Sim. Plump 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 Plump color icons?

Plump color icons tem 1.000 ícones em 16 categorias.

Qual é a licença dos Plump color icons?

Plump 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 Plump color icons?

Plump color icons são criados por Streamline.

Como usar Plump color icons no React?

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

Qual é o tamanho dos Plump color icons?

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

Coleções semelhantes