ICONYZ
Português (Brasil)

Eva Icons

eva · 490 ícones · de Akveo · MIT · uma só cor · grade de 24px · Atualizado em

Eva Icons é uma coleção de ícones grátis e de código aberto com 490 ícones SVG de Akveo, publicada sob a licença MIT. Os ícones são de uma só cor: seguem a cor do seu texto (currentColor) e podem ter a cor alterada com CSS. Eles são desenhados em uma grade de 24px e escalam sem perda de qualidade como SVG.

Especificações de design de Eva Icons

  • preenchido
  • monocromático

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 desenho20 × 20, margem de 2
Estilo de desenhoFormas preenchidas
Raio dos cantos1
CoresUma cor (currentColor), pode ser alterada com CSS
CoordenadasAté 2 casas decimais
Linhas retas66% horizontais ou verticais, 14% a 45°
Curvas58% dos comandos de desenho
Simetria32% dos ícones são simétricos da esquerda para a direita
Elementos por ícone1.4
Comandos de desenho por ícone21

Medido a partir de 63 í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 Eva Icons by Akveo, licensed under MIT. https://github.com/akveo/eva-icons/blob/master/LICENSE.txt

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 "Eva Icons" icon set (Iconify prefix "eva") by Akveo.
Style: filled, solid, monochrome.
Iconify describes the set as: Precise Shapes, Has Padding.

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

Drawing
- Filled icons: draw closed filled shapes; don't use strokes.
- Round corners with a radius of about 1.

Geometry
- Coordinates are free-form; write at most 2 decimals.
- Straight lines: 66% horizontal or vertical, 14% at 45 degrees.
- About 58% of drawing commands are curves or arcs.
- Keep it simple: about 1 element and 21 drawing commands per icon.
- Elements used by the set: path, circle, rect.

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).
Página 1 de 6
Ícone activity-fill
activity-fill
Ícone activity-outline
activity-outline
Ícone alert-circle-fill
alert-circle-fill
Ícone alert-circle-outline
alert-circle-outline
Ícone alert-triangle-fill
alert-triangle-fill
Ícone alert-triangle-outline
alert-triangle-outline
Ícone archive-fill
archive-fill
Ícone archive-outline
archive-outline
Ícone arrow-back-fill
arrow-back-fill
Ícone arrow-back-outline
arrow-back-outline
Ícone arrow-circle-down-fill
arrow-circle-down-fill
Ícone arrow-circle-down-outline
arrow-circle-down-outline
Ícone arrow-circle-left-fill
arrow-circle-left-fill
Ícone arrow-circle-left-outline
arrow-circle-left-outline
Ícone arrow-circle-right-fill
arrow-circle-right-fill
Ícone arrow-circle-right-outline
arrow-circle-right-outline
Ícone arrow-circle-up-fill
arrow-circle-up-fill
Ícone arrow-circle-up-outline
arrow-circle-up-outline
Ícone arrow-down-fill
arrow-down-fill
Ícone arrow-down-outline
arrow-down-outline
Ícone arrow-downward-fill
arrow-downward-fill
Ícone arrow-downward-outline
arrow-downward-outline
Ícone arrow-forward-fill
arrow-forward-fill
Ícone arrow-forward-outline
arrow-forward-outline
Ícone arrow-ios-back-fill
arrow-ios-back-fill
Ícone arrow-ios-back-outline
arrow-ios-back-outline
Ícone arrow-ios-downward-fill
arrow-ios-downward-fill
Ícone arrow-ios-downward-outline
arrow-ios-downward-outline
Ícone arrow-ios-forward-fill
arrow-ios-forward-fill
Ícone arrow-ios-forward-outline
arrow-ios-forward-outline
Ícone arrow-ios-upward-fill
arrow-ios-upward-fill
Ícone arrow-ios-upward-outline
arrow-ios-upward-outline
Ícone arrow-left-fill
arrow-left-fill
Ícone arrow-left-outline
arrow-left-outline
Ícone arrow-right-fill
arrow-right-fill
Ícone arrow-right-outline
arrow-right-outline
Ícone arrow-up-fill
arrow-up-fill
Ícone arrow-up-outline
arrow-up-outline
Ícone arrow-upward-fill
arrow-upward-fill
Ícone arrow-upward-outline
arrow-upward-outline
Ícone arrowhead-down-fill
arrowhead-down-fill
Ícone arrowhead-down-outline
arrowhead-down-outline
Ícone arrowhead-left-fill
arrowhead-left-fill
Ícone arrowhead-left-outline
arrowhead-left-outline
Ícone arrowhead-right-fill
arrowhead-right-fill
Ícone arrowhead-right-outline
arrowhead-right-outline
Ícone arrowhead-up-fill
arrowhead-up-fill
Ícone arrowhead-up-outline
arrowhead-up-outline
Ícone at-fill
at-fill
Ícone at-outline
at-outline
Ícone attach-2-fill
attach-2-fill
Ícone attach-2-outline
attach-2-outline
Ícone attach-fill
attach-fill
Ícone attach-outline
attach-outline
Ícone award-fill
award-fill
Ícone award-outline
award-outline
Ícone backspace-fill
backspace-fill
Ícone backspace-outline
backspace-outline
Ícone bar-chart-2-fill
bar-chart-2-fill
Ícone bar-chart-2-outline
bar-chart-2-outline
Ícone bar-chart-fill
bar-chart-fill
Ícone bar-chart-outline
bar-chart-outline
Ícone battery-fill
battery-fill
Ícone battery-outline
battery-outline
Ícone behance-fill
behance-fill
Ícone behance-outline
behance-outline
Ícone bell-fill
bell-fill
Ícone bell-off-fill
bell-off-fill
Ícone bell-off-outline
bell-off-outline
Ícone bell-outline
bell-outline
Ícone bluetooth-fill
bluetooth-fill
Ícone bluetooth-outline
bluetooth-outline
Ícone book-fill
book-fill
Ícone book-open-fill
book-open-fill
Ícone book-open-outline
book-open-outline
Ícone book-outline
book-outline
Ícone bookmark-fill
bookmark-fill
Ícone bookmark-outline
bookmark-outline
Ícone briefcase-fill
briefcase-fill
Ícone briefcase-outline
briefcase-outline
Ícone browser-fill
browser-fill
Ícone browser-outline
browser-outline
Ícone brush-fill
brush-fill
Ícone brush-outline
brush-outline
Ícone bulb-fill
bulb-fill
Ícone bulb-outline
bulb-outline
Ícone calendar-fill
calendar-fill
Ícone calendar-outline
calendar-outline
Ícone camera-fill
camera-fill
Ícone camera-outline
camera-outline
Ícone car-fill
car-fill
Ícone car-outline
car-outline
Ícone cast-fill
cast-fill
Ícone cast-outline
cast-outline
Ícone charging-fill
charging-fill
Ícone charging-outline
charging-outline

Sobre Eva Icons

Entre os Eva Icons mais populares estão droplet off outline, flash fill, printer outline, layout fill, radio button off outline e person fill.

Abra qualquer ícone para copiá-lo como SVG, JSX, Vue, Svelte, Solid, Astro ou CSS, ou baixe em SVG ou PNG. Eva Icons são publicados sob a licença MIT, que permite o uso em projetos pessoais e comerciais. Observação: esta coleção não é mais mantida ativamente pelos autores.

Como usar Eva Icons

Todos os ícones desta página funcionam em qualquer framework. Os exemplos usam eva:droplet-off-outline; 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="eva:droplet-off-outline" width="24" />

Vue

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

<template>
  <Icon icon="eva:droplet-off-outline" width="24" />
</template>

Svelte

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

<Icon icon="eva:droplet-off-outline" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[eva--droplet-off-outline]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/eva -->
<div class="i-eva:droplet-off-outline"></div>

Web component

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

<iconify-icon icon="eva:droplet-off-outline"></iconify-icon>

Imagem HTML

<img src="https://iconyz.com/api/public/svg/eva/droplet-off-outline.svg" alt="Ícone Droplet Off Outline" width="24" height="24">

Perguntas frequentes sobre Eva Icons

Os Eva Icons são grátis para uso comercial?

Sim. Eva Icons são publicados sob a licença MIT, que permite o uso em projetos pessoais e comerciais.

Quantos ícones tem Eva Icons?

Eva Icons tem 490 ícones.

Qual é a licença dos Eva Icons?

Eva Icons são distribuídos sob MIT. O texto completo da licença está disponível em https://github.com/akveo/eva-icons/blob/master/LICENSE.txt.

Quem criou Eva Icons?

Eva Icons são criados por Akveo.

Como usar Eva Icons no React?

Instale @iconify/react e renderize <Icon icon="eva:droplet-off-outline" />, ou abra qualquer ícone desta página e copie-o como um componente React independente.

Qual é o tamanho dos Eva Icons?

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

Coleções semelhantes