io logo
io from SVG Logos by Gil Barbara · Color · CC0-1.0 Free for personal and commercial use.
- Name
- io
- Set
- SVG Logos
- Style
- Color
- Viewbox
- 256×256
- License
- CC0
The same logo in other sets
Use the io logo
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path d="M96.447 7.382c32.267-8.275 67.929-3.453 96.386 14.11c35.84 21.433 59.238 61.976 59.833 103.71c1.31 42.15-20.659 83.944-55.963 106.865c-39.293 26.433-93.648 27.446-133.775 2.322c-40.9-24.41-64.774-73.645-58.641-120.916c4.94-49.95 43.52-94.005 92.16-106.09z" fill="#010101"/><path d="M91.505 27.803c60.964-24.41 135.74 20.658 142.05 86.028c9.824 58.82-38.995 118.593-98.59 120.32c-56.677 5.656-111.449-42.39-113.056-99.304c-4.227-46.08 26.136-91.803 69.596-107.044z" fill="#FFF"/><path d="M97.637 121.69c27.327-22.326 54.058-45.426 81.98-67.097c-14.646 22.505-29.708 44.711-44.354 67.215c-12.562.06-25.123.06-37.626-.119z" fill="#010101"/><path d="M120.737 134.132c12.621 0 25.183 0 37.745.179c-27.505 22.206-54.117 45.484-82.099 67.096c14.646-22.505 29.708-44.77 44.354-67.275z" fill="#010101"/></svg>
React
import type { SVGProps } from "react";
export function LogosIo(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path d="M96.447 7.382c32.267-8.275 67.929-3.453 96.386 14.11c35.84 21.433 59.238 61.976 59.833 103.71c1.31 42.15-20.659 83.944-55.963 106.865c-39.293 26.433-93.648 27.446-133.775 2.322c-40.9-24.41-64.774-73.645-58.641-120.916c4.94-49.95 43.52-94.005 92.16-106.09z" fill="#010101"/><path d="M91.505 27.803c60.964-24.41 135.74 20.658 142.05 86.028c9.824 58.82-38.995 118.593-98.59 120.32c-56.677 5.656-111.449-42.39-113.056-99.304c-4.227-46.08 26.136-91.803 69.596-107.044z" fill="#FFF"/><path d="M97.637 121.69c27.327-22.326 54.058-45.426 81.98-67.097c-14.646 22.505-29.708 44.711-44.354 67.215c-12.562.06-25.123.06-37.626-.119z" fill="#010101"/><path d="M120.737 134.132c12.621 0 25.183 0 37.745.179c-27.505 22.206-54.117 45.484-82.099 67.096c14.646-22.505 29.708-44.77 44.354-67.275z" fill="#010101"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path d="M96.447 7.382c32.267-8.275 67.929-3.453 96.386 14.11c35.84 21.433 59.238 61.976 59.833 103.71c1.31 42.15-20.659 83.944-55.963 106.865c-39.293 26.433-93.648 27.446-133.775 2.322c-40.9-24.41-64.774-73.645-58.641-120.916c4.94-49.95 43.52-94.005 92.16-106.09z" fill="#010101"/><path d="M91.505 27.803c60.964-24.41 135.74 20.658 142.05 86.028c9.824 58.82-38.995 118.593-98.59 120.32c-56.677 5.656-111.449-42.39-113.056-99.304c-4.227-46.08 26.136-91.803 69.596-107.044z" fill="#FFF"/><path d="M97.637 121.69c27.327-22.326 54.058-45.426 81.98-67.097c-14.646 22.505-29.708 44.711-44.354 67.215c-12.562.06-25.123.06-37.626-.119z" fill="#010101"/><path d="M120.737 134.132c12.621 0 25.183 0 37.745.179c-27.505 22.206-54.117 45.484-82.099 67.096c14.646-22.505 29.708-44.77 44.354-67.275z" fill="#010101"/></svg> </template>
CSS
.icon-io {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20256%20256%22%3E%3Cpath%20d%3D%22M96.447%207.382c32.267-8.275%2067.929-3.453%2096.386%2014.11c35.84%2021.433%2059.238%2061.976%2059.833%20103.71c1.31%2042.15-20.659%2083.944-55.963%20106.865c-39.293%2026.433-93.648%2027.446-133.775%202.322c-40.9-24.41-64.774-73.645-58.641-120.916c4.94-49.95%2043.52-94.005%2092.16-106.09z%22%20fill%3D%22%23010101%22%2F%3E%3Cpath%20d%3D%22M91.505%2027.803c60.964-24.41%20135.74%2020.658%20142.05%2086.028c9.824%2058.82-38.995%20118.593-98.59%20120.32c-56.677%205.656-111.449-42.39-113.056-99.304c-4.227-46.08%2026.136-91.803%2069.596-107.044z%22%20fill%3D%22%23FFF%22%2F%3E%3Cpath%20d%3D%22M97.637%20121.69c27.327-22.326%2054.058-45.426%2081.98-67.097c-14.646%2022.505-29.708%2044.711-44.354%2067.215c-12.562.06-25.123.06-37.626-.119z%22%20fill%3D%22%23010101%22%2F%3E%3Cpath%20d%3D%22M120.737%20134.132c12.621%200%2025.183%200%2037.745.179c-27.505%2022.206-54.117%2045.484-82.099%2067.096c14.646-22.505%2029.708-44.77%2044.354-67.275z%22%20fill%3D%22%23010101%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20256%20256%22%3E%3Cpath%20d%3D%22M96.447%207.382c32.267-8.275%2067.929-3.453%2096.386%2014.11c35.84%2021.433%2059.238%2061.976%2059.833%20103.71c1.31%2042.15-20.659%2083.944-55.963%20106.865c-39.293%2026.433-93.648%2027.446-133.775%202.322c-40.9-24.41-64.774-73.645-58.641-120.916c4.94-49.95%2043.52-94.005%2092.16-106.09z%22%20fill%3D%22%23010101%22%2F%3E%3Cpath%20d%3D%22M91.505%2027.803c60.964-24.41%20135.74%2020.658%20142.05%2086.028c9.824%2058.82-38.995%20118.593-98.59%20120.32c-56.677%205.656-111.449-42.39-113.056-99.304c-4.227-46.08%2026.136-91.803%2069.596-107.044z%22%20fill%3D%22%23FFF%22%2F%3E%3Cpath%20d%3D%22M97.637%20121.69c27.327-22.326%2054.058-45.426%2081.98-67.097c-14.646%2022.505-29.708%2044.711-44.354%2067.215c-12.562.06-25.123.06-37.626-.119z%22%20fill%3D%22%23010101%22%2F%3E%3Cpath%20d%3D%22M120.737%20134.132c12.621%200%2025.183%200%2037.745.179c-27.505%2022.206-54.117%2045.484-82.099%2067.096c14.646-22.505%2029.708-44.77%2044.354-67.275z%22%20fill%3D%22%23010101%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/logos/io.svg?color=%231a73e8&size=48
