Ícone Cog
bx:cog
O ícone Cog (bx:cog) é um ícone SVG gratuito da coleção BoxIcons v2 de Boxicons. Ele é desenhado em uma grade de 24 × 24. BoxIcons v2 icons são publicados sob a licença MIT, que permite o uso em projetos pessoais e comerciais. Copie como código SVG, JSX, Vue ou Svelte, ou baixe o arquivo SVG.
- Coleção
- BoxIcons v2
- Autor
- Boxicons
- Licença
- MIT
- Tamanho
- 24 × 24
- Tags
- bx cog
Código SVG
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M12 16c2.206 0 4-1.794 4-4s-1.794-4-4-4s-4 1.794-4 4s1.794 4 4 4m0-6c1.084 0 2 .916 2 2s-.916 2-2 2s-2-.916-2-2s.916-2 2-2"/><path fill="currentColor" d="m2.845 16.136l1 1.73c.531.917 1.809 1.261 2.73.73l.529-.306A8 8 0 0 0 9 19.402V20c0 1.103.897 2 2 2h2c1.103 0 2-.897 2-2v-.598a8 8 0 0 0 1.896-1.111l.529.306c.923.53 2.198.188 2.731-.731l.999-1.729a2 2 0 0 0-.731-2.732l-.505-.292a7.7 7.7 0 0 0 0-2.224l.505-.292a2 2 0 0 0 .731-2.732l-.999-1.729c-.531-.92-1.808-1.265-2.731-.732l-.529.306A8 8 0 0 0 15 4.598V4c0-1.103-.897-2-2-2h-2c-1.103 0-2 .897-2 2v.598a8 8 0 0 0-1.896 1.111l-.529-.306c-.924-.531-2.2-.187-2.731.732l-.999 1.729a2 2 0 0 0 .731 2.732l.505.292a7.7 7.7 0 0 0 0 2.223l-.505.292a2.003 2.003 0 0 0-.731 2.733m3.326-2.758A5.7 5.7 0 0 1 6 12c0-.462.058-.926.17-1.378a1 1 0 0 0-.47-1.108l-1.123-.65l.998-1.729l1.145.662a1 1 0 0 0 1.188-.142a6.1 6.1 0 0 1 2.384-1.399A1 1 0 0 0 11 5.3V4h2v1.3a1 1 0 0 0 .708.956a6.1 6.1 0 0 1 2.384 1.399a1 1 0 0 0 1.188.142l1.144-.661l1 1.729l-1.124.649a1 1 0 0 0-.47 1.108c.112.452.17.916.17 1.378s-.058.925-.171 1.378a1 1 0 0 0 .471 1.108l1.123.649l-.998 1.729l-1.145-.661a1 1 0 0 0-1.188.142a6.1 6.1 0 0 1-2.384 1.399A1 1 0 0 0 13 18.7l.002 1.3H11v-1.3a1 1 0 0 0-.708-.956a6.1 6.1 0 0 1-2.384-1.399a.99.99 0 0 0-1.188-.141l-1.144.662l-1-1.729l1.124-.651a1 1 0 0 0 .471-1.108"/></svg>
Como usar o ícone Cog
React
import { Icon } from "@iconify/react";
<Icon icon="bx:cog" width="24" />
Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="bx:cog" width="24" />
</template>
Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="bx:cog" width="24" />
Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[bx--cog]"></span>
UnoCSS
<!-- @unocss/preset-icons + @iconify-json/bx -->
<div class="i-bx:cog"></div>
Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="bx:cog"></iconify-icon>
Imagem HTML
<img src="https://iconyz.com/api/public/svg/bx/cog.svg" alt="Ícone Cog" width="24" height="24">
O ícone Cog em outras coleções
Perguntas frequentes sobre Ícone Cog
O ícone Cog é grátis para uso comercial?
Sim. BoxIcons v2 icons são publicados sob a licença MIT, que permite o uso em projetos pessoais e comerciais.
Como uso o ícone Cog no React?
Instale @iconify/react e renderize <Icon icon="bx:cog" />, ou use “Copiar código” nesta página para obter um componente React independente.
Como adiciono o ícone Cog a uma página web?
Vincule o arquivo SVG em uma tag de imagem: <img src="https://iconyz.com/api/public/svg/bx/cog.svg" alt="Ícone Cog">, ou cole o código SVG diretamente na página para estilizá-lo com CSS.
Ver todos os Ícones BoxIcons v2 →
ICONYZ
