circle logo
circle from CoreUI Brands by creativeLabs Łukasz Holeczek · Brand · CC0-1.0 Free for personal and commercial use.
- Name
- circle
- Set
- CoreUI Brands
- Style
- Brand
- Viewbox
- 32×32
- License
- CC0 1.0
The same logo in other sets
circleAkar IconscircleBootstrap IconscircleBoxIcons v2circleBoxIcons v2 Solidcircle-filledCarboncircleCodiconscircleFramework7 IconscircleFont Awesome 6 RegularcircleFont Awesome 6 SolidcircleFont Awesome RegularcircleFont Awesome SolidcircleFeather Iconscircle-12-filledFluent UI System IconscircleHuge IconscircleHumbleiconscircleIconoircircleJam IconscircleLine AwesomecircleMaterial Line IconscircleLucidecircleMaterial SymbolscircleMaterial Symbols LightcircleMaterial Design IconscircleMyna UI Icons
Use the circle logo
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M27.719 5.109c-.135-.141-.266-.286-.401-.422a10 10 0 0 0-.427-.401A15.87 15.87 0 0 0 16 0A15.9 15.9 0 0 0 4.687 4.688c-6.104 6.099-6.234 15.938-.401 22.203q.194.217.396.427l.422.401A15.9 15.9 0 0 0 16 32c4.276 0 8.292-1.661 11.318-4.682c6.099-6.104 6.229-15.943.401-22.208zM5.51 5.51A14.73 14.73 0 0 1 16 1.166c3.766 0 7.318 1.396 10.068 3.943l-1.333 1.339a12.86 12.86 0 0 0-8.734-3.391A12.84 12.84 0 0 0 6.85 6.849A12.85 12.85 0 0 0 3.058 16c0 3.266 1.198 6.339 3.391 8.734L5.11 26.067C-.265 20.254-.135 11.156 5.511 5.51zm18.396 1.756v.005l-1.354 1.354A9.76 9.76 0 0 0 16 6.12a9.8 9.8 0 0 0-6.984 2.896A9.82 9.82 0 0 0 6.12 16a9.8 9.8 0 0 0 2.5 6.552l-1.349 1.354A11.68 11.68 0 0 1 4.224 16a11.7 11.7 0 0 1 3.448-8.328A11.7 11.7 0 0 1 16 4.224c2.953 0 5.734 1.078 7.906 3.042M24.714 16c0 2.328-.906 4.516-2.552 6.161s-3.833 2.557-6.161 2.557a8.7 8.7 0 0 1-5.729-2.161v-.005c-.146-.125-.292-.25-.432-.391a11 11 0 0 1-.391-.432A8.63 8.63 0 0 1 7.288 16c0-2.328.906-4.516 2.552-6.161a8.65 8.65 0 0 1 6.161-2.552c2.13 0 4.141.766 5.729 2.161c.146.125.297.25.432.391c.141.141.266.286.391.432A8.63 8.63 0 0 1 24.714 16M9.448 23.38A9.8 9.8 0 0 0 16 25.885a9.8 9.8 0 0 0 6.984-2.901A9.8 9.8 0 0 0 25.88 16a9.8 9.8 0 0 0-2.5-6.552l1.354-1.354A11.73 11.73 0 0 1 27.781 16a11.7 11.7 0 0 1-3.453 8.328A11.7 11.7 0 0 1 16 27.781a11.73 11.73 0 0 1-7.906-3.047zm17.042 3.11A14.73 14.73 0 0 1 16 30.834a14.73 14.73 0 0 1-10.068-3.943l1.339-1.333a12.87 12.87 0 0 0 8.734 3.391a12.87 12.87 0 0 0 9.151-3.797a12.87 12.87 0 0 0 3.792-9.151a12.86 12.86 0 0 0-3.391-8.729l1.333-1.339c5.375 5.813 5.245 14.911-.401 20.557z"/></svg>
React
import type { SVGProps } from "react";
export function CibCircle(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M27.719 5.109c-.135-.141-.266-.286-.401-.422a10 10 0 0 0-.427-.401A15.87 15.87 0 0 0 16 0A15.9 15.9 0 0 0 4.687 4.688c-6.104 6.099-6.234 15.938-.401 22.203q.194.217.396.427l.422.401A15.9 15.9 0 0 0 16 32c4.276 0 8.292-1.661 11.318-4.682c6.099-6.104 6.229-15.943.401-22.208zM5.51 5.51A14.73 14.73 0 0 1 16 1.166c3.766 0 7.318 1.396 10.068 3.943l-1.333 1.339a12.86 12.86 0 0 0-8.734-3.391A12.84 12.84 0 0 0 6.85 6.849A12.85 12.85 0 0 0 3.058 16c0 3.266 1.198 6.339 3.391 8.734L5.11 26.067C-.265 20.254-.135 11.156 5.511 5.51zm18.396 1.756v.005l-1.354 1.354A9.76 9.76 0 0 0 16 6.12a9.8 9.8 0 0 0-6.984 2.896A9.82 9.82 0 0 0 6.12 16a9.8 9.8 0 0 0 2.5 6.552l-1.349 1.354A11.68 11.68 0 0 1 4.224 16a11.7 11.7 0 0 1 3.448-8.328A11.7 11.7 0 0 1 16 4.224c2.953 0 5.734 1.078 7.906 3.042M24.714 16c0 2.328-.906 4.516-2.552 6.161s-3.833 2.557-6.161 2.557a8.7 8.7 0 0 1-5.729-2.161v-.005c-.146-.125-.292-.25-.432-.391a11 11 0 0 1-.391-.432A8.63 8.63 0 0 1 7.288 16c0-2.328.906-4.516 2.552-6.161a8.65 8.65 0 0 1 6.161-2.552c2.13 0 4.141.766 5.729 2.161c.146.125.297.25.432.391c.141.141.266.286.391.432A8.63 8.63 0 0 1 24.714 16M9.448 23.38A9.8 9.8 0 0 0 16 25.885a9.8 9.8 0 0 0 6.984-2.901A9.8 9.8 0 0 0 25.88 16a9.8 9.8 0 0 0-2.5-6.552l1.354-1.354A11.73 11.73 0 0 1 27.781 16a11.7 11.7 0 0 1-3.453 8.328A11.7 11.7 0 0 1 16 27.781a11.73 11.73 0 0 1-7.906-3.047zm17.042 3.11A14.73 14.73 0 0 1 16 30.834a14.73 14.73 0 0 1-10.068-3.943l1.339-1.333a12.87 12.87 0 0 0 8.734 3.391a12.87 12.87 0 0 0 9.151-3.797a12.87 12.87 0 0 0 3.792-9.151a12.86 12.86 0 0 0-3.391-8.729l1.333-1.339c5.375 5.813 5.245 14.911-.401 20.557z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M27.719 5.109c-.135-.141-.266-.286-.401-.422a10 10 0 0 0-.427-.401A15.87 15.87 0 0 0 16 0A15.9 15.9 0 0 0 4.687 4.688c-6.104 6.099-6.234 15.938-.401 22.203q.194.217.396.427l.422.401A15.9 15.9 0 0 0 16 32c4.276 0 8.292-1.661 11.318-4.682c6.099-6.104 6.229-15.943.401-22.208zM5.51 5.51A14.73 14.73 0 0 1 16 1.166c3.766 0 7.318 1.396 10.068 3.943l-1.333 1.339a12.86 12.86 0 0 0-8.734-3.391A12.84 12.84 0 0 0 6.85 6.849A12.85 12.85 0 0 0 3.058 16c0 3.266 1.198 6.339 3.391 8.734L5.11 26.067C-.265 20.254-.135 11.156 5.511 5.51zm18.396 1.756v.005l-1.354 1.354A9.76 9.76 0 0 0 16 6.12a9.8 9.8 0 0 0-6.984 2.896A9.82 9.82 0 0 0 6.12 16a9.8 9.8 0 0 0 2.5 6.552l-1.349 1.354A11.68 11.68 0 0 1 4.224 16a11.7 11.7 0 0 1 3.448-8.328A11.7 11.7 0 0 1 16 4.224c2.953 0 5.734 1.078 7.906 3.042M24.714 16c0 2.328-.906 4.516-2.552 6.161s-3.833 2.557-6.161 2.557a8.7 8.7 0 0 1-5.729-2.161v-.005c-.146-.125-.292-.25-.432-.391a11 11 0 0 1-.391-.432A8.63 8.63 0 0 1 7.288 16c0-2.328.906-4.516 2.552-6.161a8.65 8.65 0 0 1 6.161-2.552c2.13 0 4.141.766 5.729 2.161c.146.125.297.25.432.391c.141.141.266.286.391.432A8.63 8.63 0 0 1 24.714 16M9.448 23.38A9.8 9.8 0 0 0 16 25.885a9.8 9.8 0 0 0 6.984-2.901A9.8 9.8 0 0 0 25.88 16a9.8 9.8 0 0 0-2.5-6.552l1.354-1.354A11.73 11.73 0 0 1 27.781 16a11.7 11.7 0 0 1-3.453 8.328A11.7 11.7 0 0 1 16 27.781a11.73 11.73 0 0 1-7.906-3.047zm17.042 3.11A14.73 14.73 0 0 1 16 30.834a14.73 14.73 0 0 1-10.068-3.943l1.339-1.333a12.87 12.87 0 0 0 8.734 3.391a12.87 12.87 0 0 0 9.151-3.797a12.87 12.87 0 0 0 3.792-9.151a12.86 12.86 0 0 0-3.391-8.729l1.333-1.339c5.375 5.813 5.245 14.911-.401 20.557z"/></svg> </template>
CSS
.icon-circle {
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%2032%2032%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M27.719%205.109c-.135-.141-.266-.286-.401-.422a10%2010%200%200%200-.427-.401A15.87%2015.87%200%200%200%2016%200A15.9%2015.9%200%200%200%204.687%204.688c-6.104%206.099-6.234%2015.938-.401%2022.203q.194.217.396.427l.422.401A15.9%2015.9%200%200%200%2016%2032c4.276%200%208.292-1.661%2011.318-4.682c6.099-6.104%206.229-15.943.401-22.208zM5.51%205.51A14.73%2014.73%200%200%201%2016%201.166c3.766%200%207.318%201.396%2010.068%203.943l-1.333%201.339a12.86%2012.86%200%200%200-8.734-3.391A12.84%2012.84%200%200%200%206.85%206.849A12.85%2012.85%200%200%200%203.058%2016c0%203.266%201.198%206.339%203.391%208.734L5.11%2026.067C-.265%2020.254-.135%2011.156%205.511%205.51zm18.396%201.756v.005l-1.354%201.354A9.76%209.76%200%200%200%2016%206.12a9.8%209.8%200%200%200-6.984%202.896A9.82%209.82%200%200%200%206.12%2016a9.8%209.8%200%200%200%202.5%206.552l-1.349%201.354A11.68%2011.68%200%200%201%204.224%2016a11.7%2011.7%200%200%201%203.448-8.328A11.7%2011.7%200%200%201%2016%204.224c2.953%200%205.734%201.078%207.906%203.042M24.714%2016c0%202.328-.906%204.516-2.552%206.161s-3.833%202.557-6.161%202.557a8.7%208.7%200%200%201-5.729-2.161v-.005c-.146-.125-.292-.25-.432-.391a11%2011%200%200%201-.391-.432A8.63%208.63%200%200%201%207.288%2016c0-2.328.906-4.516%202.552-6.161a8.65%208.65%200%200%201%206.161-2.552c2.13%200%204.141.766%205.729%202.161c.146.125.297.25.432.391c.141.141.266.286.391.432A8.63%208.63%200%200%201%2024.714%2016M9.448%2023.38A9.8%209.8%200%200%200%2016%2025.885a9.8%209.8%200%200%200%206.984-2.901A9.8%209.8%200%200%200%2025.88%2016a9.8%209.8%200%200%200-2.5-6.552l1.354-1.354A11.73%2011.73%200%200%201%2027.781%2016a11.7%2011.7%200%200%201-3.453%208.328A11.7%2011.7%200%200%201%2016%2027.781a11.73%2011.73%200%200%201-7.906-3.047zm17.042%203.11A14.73%2014.73%200%200%201%2016%2030.834a14.73%2014.73%200%200%201-10.068-3.943l1.339-1.333a12.87%2012.87%200%200%200%208.734%203.391a12.87%2012.87%200%200%200%209.151-3.797a12.87%2012.87%200%200%200%203.792-9.151a12.86%2012.86%200%200%200-3.391-8.729l1.333-1.339c5.375%205.813%205.245%2014.911-.401%2020.557z%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%2032%2032%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M27.719%205.109c-.135-.141-.266-.286-.401-.422a10%2010%200%200%200-.427-.401A15.87%2015.87%200%200%200%2016%200A15.9%2015.9%200%200%200%204.687%204.688c-6.104%206.099-6.234%2015.938-.401%2022.203q.194.217.396.427l.422.401A15.9%2015.9%200%200%200%2016%2032c4.276%200%208.292-1.661%2011.318-4.682c6.099-6.104%206.229-15.943.401-22.208zM5.51%205.51A14.73%2014.73%200%200%201%2016%201.166c3.766%200%207.318%201.396%2010.068%203.943l-1.333%201.339a12.86%2012.86%200%200%200-8.734-3.391A12.84%2012.84%200%200%200%206.85%206.849A12.85%2012.85%200%200%200%203.058%2016c0%203.266%201.198%206.339%203.391%208.734L5.11%2026.067C-.265%2020.254-.135%2011.156%205.511%205.51zm18.396%201.756v.005l-1.354%201.354A9.76%209.76%200%200%200%2016%206.12a9.8%209.8%200%200%200-6.984%202.896A9.82%209.82%200%200%200%206.12%2016a9.8%209.8%200%200%200%202.5%206.552l-1.349%201.354A11.68%2011.68%200%200%201%204.224%2016a11.7%2011.7%200%200%201%203.448-8.328A11.7%2011.7%200%200%201%2016%204.224c2.953%200%205.734%201.078%207.906%203.042M24.714%2016c0%202.328-.906%204.516-2.552%206.161s-3.833%202.557-6.161%202.557a8.7%208.7%200%200%201-5.729-2.161v-.005c-.146-.125-.292-.25-.432-.391a11%2011%200%200%201-.391-.432A8.63%208.63%200%200%201%207.288%2016c0-2.328.906-4.516%202.552-6.161a8.65%208.65%200%200%201%206.161-2.552c2.13%200%204.141.766%205.729%202.161c.146.125.297.25.432.391c.141.141.266.286.391.432A8.63%208.63%200%200%201%2024.714%2016M9.448%2023.38A9.8%209.8%200%200%200%2016%2025.885a9.8%209.8%200%200%200%206.984-2.901A9.8%209.8%200%200%200%2025.88%2016a9.8%209.8%200%200%200-2.5-6.552l1.354-1.354A11.73%2011.73%200%200%201%2027.781%2016a11.7%2011.7%200%200%201-3.453%208.328A11.7%2011.7%200%200%201%2016%2027.781a11.73%2011.73%200%200%201-7.906-3.047zm17.042%203.11A14.73%2014.73%200%200%201%2016%2030.834a14.73%2014.73%200%200%201-10.068-3.943l1.339-1.333a12.87%2012.87%200%200%200%208.734%203.391a12.87%2012.87%200%200%200%209.151-3.797a12.87%2012.87%200%200%200%203.792-9.151a12.86%2012.86%200%200%200-3.391-8.729l1.333-1.339c5.375%205.813%205.245%2014.911-.401%2020.557z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/cib/circle.svg?color=%231a73e8&size=48
