logo ionic icon
logo-ionic from IonIcons by Ben Sperry · Regular · MIT Free for personal and commercial use.
- Name
- logo-ionic
- Set
- IonIcons
- Style
- Regular
- Viewbox
- 512×512
- License
- MIT
- Aliases
- logo-ionic-outline
Related icons in IonIcons
logo-alipaylogo-amazonlogo-amplifylogo-androidlogo-angularlogo-appflowlogo-applelogo-apple-appstorelogo-apple-arlogo-behancelogo-bitbucketlogo-bitcoinlogo-bufferlogo-capacitorlogo-chromelogo-closed-captioninglogo-codepenlogo-css3logo-designernewslogo-deviantartlogo-discordlogo-dockerlogo-dribbblelogo-dropbox
Use the logo ionic icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M73.6 256c0-100.737 81.663-182.4 182.4-182.4c40.552 0 77.992 13.212 108.286 35.603c7.946-18.702 23.958-33.15 43.67-38.976C366.589 36.357 313.656 16 256 16C123.451 16 16 123.452 16 256s107.451 240 240 240c132.548 0 239.999-107.452 239.999-240c0-27.741-4.718-54.427-13.407-79.269c-11.824 15.985-30.428 26.649-51.564 27.742c4.795 16.319 7.371 33.605 7.371 51.527c0 100.737-81.663 182.4-182.399 182.4S73.6 356.737 73.6 256"/><path fill="currentColor" d="M491.065 207.374a238 238 0 0 0-8.473-30.643c-11.823 15.984-30.428 26.649-51.564 27.742a181.6 181.6 0 0 1 6.719 35.964c22.259-2.737 41.5-15.226 53.318-33.063M256 361.001c57.853 0 105-47.057 105-105c0-57.854-47.057-105-105-105s-105 47.146-105 105s47.147 105 105 105M413.5 166c28.995 0 52.5-23.505 52.5-52.5S442.495 61 413.5 61S361 84.505 361 113.5s23.505 52.5 52.5 52.5"/></svg>
React
import type { SVGProps } from "react";
export function IonLogoIonic(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M73.6 256c0-100.737 81.663-182.4 182.4-182.4c40.552 0 77.992 13.212 108.286 35.603c7.946-18.702 23.958-33.15 43.67-38.976C366.589 36.357 313.656 16 256 16C123.451 16 16 123.452 16 256s107.451 240 240 240c132.548 0 239.999-107.452 239.999-240c0-27.741-4.718-54.427-13.407-79.269c-11.824 15.985-30.428 26.649-51.564 27.742c4.795 16.319 7.371 33.605 7.371 51.527c0 100.737-81.663 182.4-182.399 182.4S73.6 356.737 73.6 256"/><path fill="currentColor" d="M491.065 207.374a238 238 0 0 0-8.473-30.643c-11.823 15.984-30.428 26.649-51.564 27.742a181.6 181.6 0 0 1 6.719 35.964c22.259-2.737 41.5-15.226 53.318-33.063M256 361.001c57.853 0 105-47.057 105-105c0-57.854-47.057-105-105-105s-105 47.146-105 105s47.147 105 105 105M413.5 166c28.995 0 52.5-23.505 52.5-52.5S442.495 61 413.5 61S361 84.505 361 113.5s23.505 52.5 52.5 52.5"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M73.6 256c0-100.737 81.663-182.4 182.4-182.4c40.552 0 77.992 13.212 108.286 35.603c7.946-18.702 23.958-33.15 43.67-38.976C366.589 36.357 313.656 16 256 16C123.451 16 16 123.452 16 256s107.451 240 240 240c132.548 0 239.999-107.452 239.999-240c0-27.741-4.718-54.427-13.407-79.269c-11.824 15.985-30.428 26.649-51.564 27.742c4.795 16.319 7.371 33.605 7.371 51.527c0 100.737-81.663 182.4-182.399 182.4S73.6 356.737 73.6 256"/><path fill="currentColor" d="M491.065 207.374a238 238 0 0 0-8.473-30.643c-11.823 15.984-30.428 26.649-51.564 27.742a181.6 181.6 0 0 1 6.719 35.964c22.259-2.737 41.5-15.226 53.318-33.063M256 361.001c57.853 0 105-47.057 105-105c0-57.854-47.057-105-105-105s-105 47.146-105 105s47.147 105 105 105M413.5 166c28.995 0 52.5-23.505 52.5-52.5S442.495 61 413.5 61S361 84.505 361 113.5s23.505 52.5 52.5 52.5"/></svg> </template>
CSS
.icon-logo-ionic {
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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M73.6%20256c0-100.737%2081.663-182.4%20182.4-182.4c40.552%200%2077.992%2013.212%20108.286%2035.603c7.946-18.702%2023.958-33.15%2043.67-38.976C366.589%2036.357%20313.656%2016%20256%2016C123.451%2016%2016%20123.452%2016%20256s107.451%20240%20240%20240c132.548%200%20239.999-107.452%20239.999-240c0-27.741-4.718-54.427-13.407-79.269c-11.824%2015.985-30.428%2026.649-51.564%2027.742c4.795%2016.319%207.371%2033.605%207.371%2051.527c0%20100.737-81.663%20182.4-182.399%20182.4S73.6%20356.737%2073.6%20256%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M491.065%20207.374a238%20238%200%200%200-8.473-30.643c-11.823%2015.984-30.428%2026.649-51.564%2027.742a181.6%20181.6%200%200%201%206.719%2035.964c22.259-2.737%2041.5-15.226%2053.318-33.063M256%20361.001c57.853%200%20105-47.057%20105-105c0-57.854-47.057-105-105-105s-105%2047.146-105%20105s47.147%20105%20105%20105M413.5%20166c28.995%200%2052.5-23.505%2052.5-52.5S442.495%2061%20413.5%2061S361%2084.505%20361%20113.5s23.505%2052.5%2052.5%2052.5%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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M73.6%20256c0-100.737%2081.663-182.4%20182.4-182.4c40.552%200%2077.992%2013.212%20108.286%2035.603c7.946-18.702%2023.958-33.15%2043.67-38.976C366.589%2036.357%20313.656%2016%20256%2016C123.451%2016%2016%20123.452%2016%20256s107.451%20240%20240%20240c132.548%200%20239.999-107.452%20239.999-240c0-27.741-4.718-54.427-13.407-79.269c-11.824%2015.985-30.428%2026.649-51.564%2027.742c4.795%2016.319%207.371%2033.605%207.371%2051.527c0%20100.737-81.663%20182.4-182.399%20182.4S73.6%20356.737%2073.6%20256%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M491.065%20207.374a238%20238%200%200%200-8.473-30.643c-11.823%2015.984-30.428%2026.649-51.564%2027.742a181.6%20181.6%200%200%201%206.719%2035.964c22.259-2.737%2041.5-15.226%2053.318-33.063M256%20361.001c57.853%200%20105-47.057%20105-105c0-57.854-47.057-105-105-105s-105%2047.146-105%20105s47.147%20105%20105%20105M413.5%20166c28.995%200%2052.5-23.505%2052.5-52.5S442.495%2061%20413.5%2061S361%2084.505%20361%20113.5s23.505%2052.5%2052.5%2052.5%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ion/logo-ionic.svg?color=%231a73e8&size=48
