chromatic logo
chromatic from Simple Icons by Simple Icons Collaborators · Brand · CC0-1.0 Free for personal and commercial use.
- Name
- chromatic
- Set
- Simple Icons
- Style
- Brand
- Viewbox
- 24×24
- License
- CC0 1.0
The same logo in other sets
Use the chromatic logo
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12a12 12 0 0 0 12-12A12 12 0 0 0 12 0m-.006 3.43a3.37 3.37 0 0 1 3.37 3.369v2.199L9.628 5.689a4.3 4.3 0 0 0-.688-.32a3.35 3.35 0 0 1 3.053-1.94zm-4.498 2.6c.588 0 1.17.156 1.684.452l5.734 3.311l-2.91 1.678l-3.6-2.076a.46.46 0 0 0-.459 0L5.35 10.893a4 4 0 0 0-.621.433a3.35 3.35 0 0 1-.155-3.61A3.39 3.39 0 0 1 7.496 6.03m8.723.015a3.38 3.38 0 0 1 3.205 1.672a3.37 3.37 0 0 1-1.235 4.6l-5.736 3.308v-3.357l3.602-2.077a.46.46 0 0 0 .228-.398V6.799a4.4 4.4 0 0 0-.064-.754m-8.504 4.543v6.617q0 .38.066.754a3 3 0 0 1-.285.012a3.38 3.38 0 0 1-2.92-1.684a3.34 3.34 0 0 1-.338-2.555a3.34 3.34 0 0 1 1.57-2.044zm.908 0l2.912 1.68v4.152a.46.46 0 0 0 .23.396l2.594 1.498h.002q.33.191.688.32a3.35 3.35 0 0 1-3.055 1.938a3.373 3.373 0 0 1-3.371-3.367zm10.647 2.088a3.35 3.35 0 0 1 .154 3.611a3.37 3.37 0 0 1-4.604 1.233l-1.908-1.1l5.738-3.309a4.3 4.3 0 0 0 .62-.435"/></svg>
React
import type { SVGProps } from "react";
export function SimpleIconsChromatic(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12a12 12 0 0 0 12-12A12 12 0 0 0 12 0m-.006 3.43a3.37 3.37 0 0 1 3.37 3.369v2.199L9.628 5.689a4.3 4.3 0 0 0-.688-.32a3.35 3.35 0 0 1 3.053-1.94zm-4.498 2.6c.588 0 1.17.156 1.684.452l5.734 3.311l-2.91 1.678l-3.6-2.076a.46.46 0 0 0-.459 0L5.35 10.893a4 4 0 0 0-.621.433a3.35 3.35 0 0 1-.155-3.61A3.39 3.39 0 0 1 7.496 6.03m8.723.015a3.38 3.38 0 0 1 3.205 1.672a3.37 3.37 0 0 1-1.235 4.6l-5.736 3.308v-3.357l3.602-2.077a.46.46 0 0 0 .228-.398V6.799a4.4 4.4 0 0 0-.064-.754m-8.504 4.543v6.617q0 .38.066.754a3 3 0 0 1-.285.012a3.38 3.38 0 0 1-2.92-1.684a3.34 3.34 0 0 1-.338-2.555a3.34 3.34 0 0 1 1.57-2.044zm.908 0l2.912 1.68v4.152a.46.46 0 0 0 .23.396l2.594 1.498h.002q.33.191.688.32a3.35 3.35 0 0 1-3.055 1.938a3.373 3.373 0 0 1-3.371-3.367zm10.647 2.088a3.35 3.35 0 0 1 .154 3.611a3.37 3.37 0 0 1-4.604 1.233l-1.908-1.1l5.738-3.309a4.3 4.3 0 0 0 .62-.435"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12a12 12 0 0 0 12-12A12 12 0 0 0 12 0m-.006 3.43a3.37 3.37 0 0 1 3.37 3.369v2.199L9.628 5.689a4.3 4.3 0 0 0-.688-.32a3.35 3.35 0 0 1 3.053-1.94zm-4.498 2.6c.588 0 1.17.156 1.684.452l5.734 3.311l-2.91 1.678l-3.6-2.076a.46.46 0 0 0-.459 0L5.35 10.893a4 4 0 0 0-.621.433a3.35 3.35 0 0 1-.155-3.61A3.39 3.39 0 0 1 7.496 6.03m8.723.015a3.38 3.38 0 0 1 3.205 1.672a3.37 3.37 0 0 1-1.235 4.6l-5.736 3.308v-3.357l3.602-2.077a.46.46 0 0 0 .228-.398V6.799a4.4 4.4 0 0 0-.064-.754m-8.504 4.543v6.617q0 .38.066.754a3 3 0 0 1-.285.012a3.38 3.38 0 0 1-2.92-1.684a3.34 3.34 0 0 1-.338-2.555a3.34 3.34 0 0 1 1.57-2.044zm.908 0l2.912 1.68v4.152a.46.46 0 0 0 .23.396l2.594 1.498h.002q.33.191.688.32a3.35 3.35 0 0 1-3.055 1.938a3.373 3.373 0 0 1-3.371-3.367zm10.647 2.088a3.35 3.35 0 0 1 .154 3.611a3.37 3.37 0 0 1-4.604 1.233l-1.908-1.1l5.738-3.309a4.3 4.3 0 0 0 .62-.435"/></svg> </template>
CSS
.icon-chromatic {
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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12%200A12%2012%200%200%200%200%2012a12%2012%200%200%200%2012%2012a12%2012%200%200%200%2012-12A12%2012%200%200%200%2012%200m-.006%203.43a3.37%203.37%200%200%201%203.37%203.369v2.199L9.628%205.689a4.3%204.3%200%200%200-.688-.32a3.35%203.35%200%200%201%203.053-1.94zm-4.498%202.6c.588%200%201.17.156%201.684.452l5.734%203.311l-2.91%201.678l-3.6-2.076a.46.46%200%200%200-.459%200L5.35%2010.893a4%204%200%200%200-.621.433a3.35%203.35%200%200%201-.155-3.61A3.39%203.39%200%200%201%207.496%206.03m8.723.015a3.38%203.38%200%200%201%203.205%201.672a3.37%203.37%200%200%201-1.235%204.6l-5.736%203.308v-3.357l3.602-2.077a.46.46%200%200%200%20.228-.398V6.799a4.4%204.4%200%200%200-.064-.754m-8.504%204.543v6.617q0%20.38.066.754a3%203%200%200%201-.285.012a3.38%203.38%200%200%201-2.92-1.684a3.34%203.34%200%200%201-.338-2.555a3.34%203.34%200%200%201%201.57-2.044zm.908%200l2.912%201.68v4.152a.46.46%200%200%200%20.23.396l2.594%201.498h.002q.33.191.688.32a3.35%203.35%200%200%201-3.055%201.938a3.373%203.373%200%200%201-3.371-3.367zm10.647%202.088a3.35%203.35%200%200%201%20.154%203.611a3.37%203.37%200%200%201-4.604%201.233l-1.908-1.1l5.738-3.309a4.3%204.3%200%200%200%20.62-.435%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12%200A12%2012%200%200%200%200%2012a12%2012%200%200%200%2012%2012a12%2012%200%200%200%2012-12A12%2012%200%200%200%2012%200m-.006%203.43a3.37%203.37%200%200%201%203.37%203.369v2.199L9.628%205.689a4.3%204.3%200%200%200-.688-.32a3.35%203.35%200%200%201%203.053-1.94zm-4.498%202.6c.588%200%201.17.156%201.684.452l5.734%203.311l-2.91%201.678l-3.6-2.076a.46.46%200%200%200-.459%200L5.35%2010.893a4%204%200%200%200-.621.433a3.35%203.35%200%200%201-.155-3.61A3.39%203.39%200%200%201%207.496%206.03m8.723.015a3.38%203.38%200%200%201%203.205%201.672a3.37%203.37%200%200%201-1.235%204.6l-5.736%203.308v-3.357l3.602-2.077a.46.46%200%200%200%20.228-.398V6.799a4.4%204.4%200%200%200-.064-.754m-8.504%204.543v6.617q0%20.38.066.754a3%203%200%200%201-.285.012a3.38%203.38%200%200%201-2.92-1.684a3.34%203.34%200%200%201-.338-2.555a3.34%203.34%200%200%201%201.57-2.044zm.908%200l2.912%201.68v4.152a.46.46%200%200%200%20.23.396l2.594%201.498h.002q.33.191.688.32a3.35%203.35%200%200%201-3.055%201.938a3.373%203.373%200%200%201-3.371-3.367zm10.647%202.088a3.35%203.35%200%200%201%20.154%203.611a3.37%203.37%200%200%201-4.604%201.233l-1.908-1.1l5.738-3.309a4.3%204.3%200%200%200%20.62-.435%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/simple-icons/chromatic.svg?color=%231a73e8&size=48
