sass logo
sass from Material Icon Theme by Material Extensions · Color · MIT Free for personal and commercial use.
- Name
- sass
- Set
- Material Icon Theme
- Style
- Color
- Viewbox
- 32×32
- License
- MIT
The same logo in other sets
Use the sass logo
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="#ec407a" d="M27.837 5.673a4.33 4.33 0 0 0-2.293-2.701c-2.362-1.261-6.11-1.298-9.548-.092a26.3 26.3 0 0 0-8.76 4.966c-2.752 2.542-3.438 4.925-3.189 6.194c.523 2.668 3.274 4.539 5.485 6.042c.418.284.822.559 1.175.816c-1.429.76-4.261 2.444-5.088 4.248a3.88 3.88 0 0 0-.118 3.332A2.37 2.37 0 0 0 6.869 29.8a5.6 5.6 0 0 0 1.49.2a6.35 6.35 0 0 0 5.19-2.856a6.74 6.74 0 0 0 .864-5.382a7.3 7.3 0 0 1 2.044-.03a3.92 3.92 0 0 1 2.816 1.311a1.82 1.82 0 0 1 .423 1.262a1.55 1.55 0 0 1-.772 1.05c-.234.14-.586.355-.504.803c.036.194.198.633.894.512a2.93 2.93 0 0 0 2.145-2.651a4 4 0 0 0-1.197-2.904a5.94 5.94 0 0 0-4.396-1.626a10.6 10.6 0 0 0-2.672.304a20 20 0 0 0-2.203-1.846c-1.712-1.3-3.33-2.529-3.235-4.26c.125-2.263 2.468-4.532 6.964-6.744c4.016-1.976 7.254-2.037 8.944-1.438a2 2 0 0 1 1.204.883a2.77 2.77 0 0 1-.36 2.47a9.71 9.71 0 0 1-7.425 4.304a3.86 3.86 0 0 1-3.238-.757c-.278-.302-.593-.645-1.074-.383q-.565.31-.225 1.189a3.9 3.9 0 0 0 2.407 1.92a11.7 11.7 0 0 0 7.128-.671c3.527-1.35 6.681-5.202 5.756-8.787M11.895 24.475a4 4 0 0 1-.192.468a4.5 4.5 0 0 1-.753 1.081a2.83 2.83 0 0 1-2.533 1.107c-.056-.032-.078-.146-.085-.193a3.28 3.28 0 0 1 1.076-2.284a11.3 11.3 0 0 1 2.644-1.933a3.85 3.85 0 0 1-.157 1.754"/></svg>
React
import type { SVGProps } from "react";
export function MaterialIconThemeSass(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="#ec407a" d="M27.837 5.673a4.33 4.33 0 0 0-2.293-2.701c-2.362-1.261-6.11-1.298-9.548-.092a26.3 26.3 0 0 0-8.76 4.966c-2.752 2.542-3.438 4.925-3.189 6.194c.523 2.668 3.274 4.539 5.485 6.042c.418.284.822.559 1.175.816c-1.429.76-4.261 2.444-5.088 4.248a3.88 3.88 0 0 0-.118 3.332A2.37 2.37 0 0 0 6.869 29.8a5.6 5.6 0 0 0 1.49.2a6.35 6.35 0 0 0 5.19-2.856a6.74 6.74 0 0 0 .864-5.382a7.3 7.3 0 0 1 2.044-.03a3.92 3.92 0 0 1 2.816 1.311a1.82 1.82 0 0 1 .423 1.262a1.55 1.55 0 0 1-.772 1.05c-.234.14-.586.355-.504.803c.036.194.198.633.894.512a2.93 2.93 0 0 0 2.145-2.651a4 4 0 0 0-1.197-2.904a5.94 5.94 0 0 0-4.396-1.626a10.6 10.6 0 0 0-2.672.304a20 20 0 0 0-2.203-1.846c-1.712-1.3-3.33-2.529-3.235-4.26c.125-2.263 2.468-4.532 6.964-6.744c4.016-1.976 7.254-2.037 8.944-1.438a2 2 0 0 1 1.204.883a2.77 2.77 0 0 1-.36 2.47a9.71 9.71 0 0 1-7.425 4.304a3.86 3.86 0 0 1-3.238-.757c-.278-.302-.593-.645-1.074-.383q-.565.31-.225 1.189a3.9 3.9 0 0 0 2.407 1.92a11.7 11.7 0 0 0 7.128-.671c3.527-1.35 6.681-5.202 5.756-8.787M11.895 24.475a4 4 0 0 1-.192.468a4.5 4.5 0 0 1-.753 1.081a2.83 2.83 0 0 1-2.533 1.107c-.056-.032-.078-.146-.085-.193a3.28 3.28 0 0 1 1.076-2.284a11.3 11.3 0 0 1 2.644-1.933a3.85 3.85 0 0 1-.157 1.754"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="#ec407a" d="M27.837 5.673a4.33 4.33 0 0 0-2.293-2.701c-2.362-1.261-6.11-1.298-9.548-.092a26.3 26.3 0 0 0-8.76 4.966c-2.752 2.542-3.438 4.925-3.189 6.194c.523 2.668 3.274 4.539 5.485 6.042c.418.284.822.559 1.175.816c-1.429.76-4.261 2.444-5.088 4.248a3.88 3.88 0 0 0-.118 3.332A2.37 2.37 0 0 0 6.869 29.8a5.6 5.6 0 0 0 1.49.2a6.35 6.35 0 0 0 5.19-2.856a6.74 6.74 0 0 0 .864-5.382a7.3 7.3 0 0 1 2.044-.03a3.92 3.92 0 0 1 2.816 1.311a1.82 1.82 0 0 1 .423 1.262a1.55 1.55 0 0 1-.772 1.05c-.234.14-.586.355-.504.803c.036.194.198.633.894.512a2.93 2.93 0 0 0 2.145-2.651a4 4 0 0 0-1.197-2.904a5.94 5.94 0 0 0-4.396-1.626a10.6 10.6 0 0 0-2.672.304a20 20 0 0 0-2.203-1.846c-1.712-1.3-3.33-2.529-3.235-4.26c.125-2.263 2.468-4.532 6.964-6.744c4.016-1.976 7.254-2.037 8.944-1.438a2 2 0 0 1 1.204.883a2.77 2.77 0 0 1-.36 2.47a9.71 9.71 0 0 1-7.425 4.304a3.86 3.86 0 0 1-3.238-.757c-.278-.302-.593-.645-1.074-.383q-.565.31-.225 1.189a3.9 3.9 0 0 0 2.407 1.92a11.7 11.7 0 0 0 7.128-.671c3.527-1.35 6.681-5.202 5.756-8.787M11.895 24.475a4 4 0 0 1-.192.468a4.5 4.5 0 0 1-.753 1.081a2.83 2.83 0 0 1-2.533 1.107c-.056-.032-.078-.146-.085-.193a3.28 3.28 0 0 1 1.076-2.284a11.3 11.3 0 0 1 2.644-1.933a3.85 3.85 0 0 1-.157 1.754"/></svg> </template>
CSS
.icon-sass {
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%22%23ec407a%22%20d%3D%22M27.837%205.673a4.33%204.33%200%200%200-2.293-2.701c-2.362-1.261-6.11-1.298-9.548-.092a26.3%2026.3%200%200%200-8.76%204.966c-2.752%202.542-3.438%204.925-3.189%206.194c.523%202.668%203.274%204.539%205.485%206.042c.418.284.822.559%201.175.816c-1.429.76-4.261%202.444-5.088%204.248a3.88%203.88%200%200%200-.118%203.332A2.37%202.37%200%200%200%206.869%2029.8a5.6%205.6%200%200%200%201.49.2a6.35%206.35%200%200%200%205.19-2.856a6.74%206.74%200%200%200%20.864-5.382a7.3%207.3%200%200%201%202.044-.03a3.92%203.92%200%200%201%202.816%201.311a1.82%201.82%200%200%201%20.423%201.262a1.55%201.55%200%200%201-.772%201.05c-.234.14-.586.355-.504.803c.036.194.198.633.894.512a2.93%202.93%200%200%200%202.145-2.651a4%204%200%200%200-1.197-2.904a5.94%205.94%200%200%200-4.396-1.626a10.6%2010.6%200%200%200-2.672.304a20%2020%200%200%200-2.203-1.846c-1.712-1.3-3.33-2.529-3.235-4.26c.125-2.263%202.468-4.532%206.964-6.744c4.016-1.976%207.254-2.037%208.944-1.438a2%202%200%200%201%201.204.883a2.77%202.77%200%200%201-.36%202.47a9.71%209.71%200%200%201-7.425%204.304a3.86%203.86%200%200%201-3.238-.757c-.278-.302-.593-.645-1.074-.383q-.565.31-.225%201.189a3.9%203.9%200%200%200%202.407%201.92a11.7%2011.7%200%200%200%207.128-.671c3.527-1.35%206.681-5.202%205.756-8.787M11.895%2024.475a4%204%200%200%201-.192.468a4.5%204.5%200%200%201-.753%201.081a2.83%202.83%200%200%201-2.533%201.107c-.056-.032-.078-.146-.085-.193a3.28%203.28%200%200%201%201.076-2.284a11.3%2011.3%200%200%201%202.644-1.933a3.85%203.85%200%200%201-.157%201.754%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%22%23ec407a%22%20d%3D%22M27.837%205.673a4.33%204.33%200%200%200-2.293-2.701c-2.362-1.261-6.11-1.298-9.548-.092a26.3%2026.3%200%200%200-8.76%204.966c-2.752%202.542-3.438%204.925-3.189%206.194c.523%202.668%203.274%204.539%205.485%206.042c.418.284.822.559%201.175.816c-1.429.76-4.261%202.444-5.088%204.248a3.88%203.88%200%200%200-.118%203.332A2.37%202.37%200%200%200%206.869%2029.8a5.6%205.6%200%200%200%201.49.2a6.35%206.35%200%200%200%205.19-2.856a6.74%206.74%200%200%200%20.864-5.382a7.3%207.3%200%200%201%202.044-.03a3.92%203.92%200%200%201%202.816%201.311a1.82%201.82%200%200%201%20.423%201.262a1.55%201.55%200%200%201-.772%201.05c-.234.14-.586.355-.504.803c.036.194.198.633.894.512a2.93%202.93%200%200%200%202.145-2.651a4%204%200%200%200-1.197-2.904a5.94%205.94%200%200%200-4.396-1.626a10.6%2010.6%200%200%200-2.672.304a20%2020%200%200%200-2.203-1.846c-1.712-1.3-3.33-2.529-3.235-4.26c.125-2.263%202.468-4.532%206.964-6.744c4.016-1.976%207.254-2.037%208.944-1.438a2%202%200%200%201%201.204.883a2.77%202.77%200%200%201-.36%202.47a9.71%209.71%200%200%201-7.425%204.304a3.86%203.86%200%200%201-3.238-.757c-.278-.302-.593-.645-1.074-.383q-.565.31-.225%201.189a3.9%203.9%200%200%200%202.407%201.92a11.7%2011.7%200%200%200%207.128-.671c3.527-1.35%206.681-5.202%205.756-8.787M11.895%2024.475a4%204%200%200%201-.192.468a4.5%204.5%200%200%201-.753%201.081a2.83%202.83%200%200%201-2.533%201.107c-.056-.032-.078-.146-.085-.193a3.28%203.28%200%200%201%201.076-2.284a11.3%2011.3%200%200%201%202.644-1.933a3.85%203.85%200%200%201-.157%201.754%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/material-icon-theme/sass.svg?color=%231a73e8&size=48
