stylus logo
stylus from Material Icon Theme by Material Extensions · Color · MIT Free for personal and commercial use.
- Name
- stylus
- Set
- Material Icon Theme
- Style
- Color
- Viewbox
- 200×200
- License
- MIT
The same logo in other sets
Use the stylus logo
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 200 200"><path fill="#c0ca33" d="M127.22 155.91c14.639-17.51 16.362-35.594 5.023-69.178c-7.176-21.241-19.089-37.603-10.334-50.807c9.33-14.065 29.135-.43 12.63 18.371l3.301 2.296c19.806 2.297 29.566-24.83 14.783-32.58c-39.038-20.38-73.197 18.802-58.127 64.155c6.459 19.232 15.501 39.613 8.181 55.831c-6.315 13.922-18.515 22.103-26.695 22.39c-17.079.862-5.74-38.32 13.922-48.08c1.722-.86 4.162-2.009 1.866-4.88c-24.255-2.726-38.464 8.468-46.645 24.113c-23.825 45.497 45.21 62.289 82.096 18.37z"/></svg>
React
import type { SVGProps } from "react";
export function MaterialIconThemeStylus(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 200 200"><path fill="#c0ca33" d="M127.22 155.91c14.639-17.51 16.362-35.594 5.023-69.178c-7.176-21.241-19.089-37.603-10.334-50.807c9.33-14.065 29.135-.43 12.63 18.371l3.301 2.296c19.806 2.297 29.566-24.83 14.783-32.58c-39.038-20.38-73.197 18.802-58.127 64.155c6.459 19.232 15.501 39.613 8.181 55.831c-6.315 13.922-18.515 22.103-26.695 22.39c-17.079.862-5.74-38.32 13.922-48.08c1.722-.86 4.162-2.009 1.866-4.88c-24.255-2.726-38.464 8.468-46.645 24.113c-23.825 45.497 45.21 62.289 82.096 18.37z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 200 200"><path fill="#c0ca33" d="M127.22 155.91c14.639-17.51 16.362-35.594 5.023-69.178c-7.176-21.241-19.089-37.603-10.334-50.807c9.33-14.065 29.135-.43 12.63 18.371l3.301 2.296c19.806 2.297 29.566-24.83 14.783-32.58c-39.038-20.38-73.197 18.802-58.127 64.155c6.459 19.232 15.501 39.613 8.181 55.831c-6.315 13.922-18.515 22.103-26.695 22.39c-17.079.862-5.74-38.32 13.922-48.08c1.722-.86 4.162-2.009 1.866-4.88c-24.255-2.726-38.464 8.468-46.645 24.113c-23.825 45.497 45.21 62.289 82.096 18.37z"/></svg> </template>
CSS
.icon-stylus {
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%20200%20200%22%3E%3Cpath%20fill%3D%22%23c0ca33%22%20d%3D%22M127.22%20155.91c14.639-17.51%2016.362-35.594%205.023-69.178c-7.176-21.241-19.089-37.603-10.334-50.807c9.33-14.065%2029.135-.43%2012.63%2018.371l3.301%202.296c19.806%202.297%2029.566-24.83%2014.783-32.58c-39.038-20.38-73.197%2018.802-58.127%2064.155c6.459%2019.232%2015.501%2039.613%208.181%2055.831c-6.315%2013.922-18.515%2022.103-26.695%2022.39c-17.079.862-5.74-38.32%2013.922-48.08c1.722-.86%204.162-2.009%201.866-4.88c-24.255-2.726-38.464%208.468-46.645%2024.113c-23.825%2045.497%2045.21%2062.289%2082.096%2018.37z%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%20200%20200%22%3E%3Cpath%20fill%3D%22%23c0ca33%22%20d%3D%22M127.22%20155.91c14.639-17.51%2016.362-35.594%205.023-69.178c-7.176-21.241-19.089-37.603-10.334-50.807c9.33-14.065%2029.135-.43%2012.63%2018.371l3.301%202.296c19.806%202.297%2029.566-24.83%2014.783-32.58c-39.038-20.38-73.197%2018.802-58.127%2064.155c6.459%2019.232%2015.501%2039.613%208.181%2055.831c-6.315%2013.922-18.515%2022.103-26.695%2022.39c-17.079.862-5.74-38.32%2013.922-48.08c1.722-.86%204.162-2.009%201.866-4.88c-24.255-2.726-38.464%208.468-46.645%2024.113c-23.825%2045.497%2045.21%2062.289%2082.096%2018.37z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/material-icon-theme/stylus.svg?color=%231a73e8&size=48
