tint icon
tint from Line Awesome by Icons8 · Line · Status · Apache-2.0 Free for personal and commercial use.
- Name
- tint
- Set
- Line Awesome
- Style
- Line
- Category
- Status
- Viewbox
- 32×32
- License
- Apache 2.0
- Aliases
- tint-solid
More status icons from Line Awesome
banbattery-emptybattery-fullbattery-halfbattery-quarterbattery-three-quartersbellbell-slashbell-slash-solidbell-solidcalendarcalendar-altcalendar-alt-solidcalendar-checkcalendar-check-solidcalendar-daycalendar-minuscalendar-minus-solidcalendar-pluscalendar-plus-solidcalendar-solidcalendar-timescalendar-times-solidcalendar-week
Use the tint icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="m16 3.438l-.781.937s-2 2.41-4.031 5.406c-1.016 1.5-2.063 3.137-2.844 4.719S7 17.598 7 19c0 4.945 4.055 9 9 9s9-4.055 9-9c0-1.402-.563-2.918-1.344-4.5s-1.828-3.219-2.843-4.719c-2.032-2.996-4.032-5.406-4.032-5.406zm0 3.218c.559.692 1.605 1.918 3.188 4.25c.984 1.45 1.937 3.047 2.656 4.5C22.562 16.86 23 18.203 23 19c0 3.855-3.145 7-7 7s-7-3.145-7-7c0-.797.438-2.14 1.156-3.594c.719-1.453 1.672-3.05 2.656-4.5c1.583-2.332 2.63-3.558 3.188-4.25M11 19c0 2.746 2.254 5 5 5v-2a3 3 0 0 1-3-3z"/></svg>
React
import type { SVGProps } from "react";
export function LaTint(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="m16 3.438l-.781.937s-2 2.41-4.031 5.406c-1.016 1.5-2.063 3.137-2.844 4.719S7 17.598 7 19c0 4.945 4.055 9 9 9s9-4.055 9-9c0-1.402-.563-2.918-1.344-4.5s-1.828-3.219-2.843-4.719c-2.032-2.996-4.032-5.406-4.032-5.406zm0 3.218c.559.692 1.605 1.918 3.188 4.25c.984 1.45 1.937 3.047 2.656 4.5C22.562 16.86 23 18.203 23 19c0 3.855-3.145 7-7 7s-7-3.145-7-7c0-.797.438-2.14 1.156-3.594c.719-1.453 1.672-3.05 2.656-4.5c1.583-2.332 2.63-3.558 3.188-4.25M11 19c0 2.746 2.254 5 5 5v-2a3 3 0 0 1-3-3z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="m16 3.438l-.781.937s-2 2.41-4.031 5.406c-1.016 1.5-2.063 3.137-2.844 4.719S7 17.598 7 19c0 4.945 4.055 9 9 9s9-4.055 9-9c0-1.402-.563-2.918-1.344-4.5s-1.828-3.219-2.843-4.719c-2.032-2.996-4.032-5.406-4.032-5.406zm0 3.218c.559.692 1.605 1.918 3.188 4.25c.984 1.45 1.937 3.047 2.656 4.5C22.562 16.86 23 18.203 23 19c0 3.855-3.145 7-7 7s-7-3.145-7-7c0-.797.438-2.14 1.156-3.594c.719-1.453 1.672-3.05 2.656-4.5c1.583-2.332 2.63-3.558 3.188-4.25M11 19c0 2.746 2.254 5 5 5v-2a3 3 0 0 1-3-3z"/></svg> </template>
CSS
.icon-tint {
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%22m16%203.438l-.781.937s-2%202.41-4.031%205.406c-1.016%201.5-2.063%203.137-2.844%204.719S7%2017.598%207%2019c0%204.945%204.055%209%209%209s9-4.055%209-9c0-1.402-.563-2.918-1.344-4.5s-1.828-3.219-2.843-4.719c-2.032-2.996-4.032-5.406-4.032-5.406zm0%203.218c.559.692%201.605%201.918%203.188%204.25c.984%201.45%201.937%203.047%202.656%204.5C22.562%2016.86%2023%2018.203%2023%2019c0%203.855-3.145%207-7%207s-7-3.145-7-7c0-.797.438-2.14%201.156-3.594c.719-1.453%201.672-3.05%202.656-4.5c1.583-2.332%202.63-3.558%203.188-4.25M11%2019c0%202.746%202.254%205%205%205v-2a3%203%200%200%201-3-3z%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%22m16%203.438l-.781.937s-2%202.41-4.031%205.406c-1.016%201.5-2.063%203.137-2.844%204.719S7%2017.598%207%2019c0%204.945%204.055%209%209%209s9-4.055%209-9c0-1.402-.563-2.918-1.344-4.5s-1.828-3.219-2.843-4.719c-2.032-2.996-4.032-5.406-4.032-5.406zm0%203.218c.559.692%201.605%201.918%203.188%204.25c.984%201.45%201.937%203.047%202.656%204.5C22.562%2016.86%2023%2018.203%2023%2019c0%203.855-3.145%207-7%207s-7-3.145-7-7c0-.797.438-2.14%201.156-3.594c.719-1.453%201.672-3.05%202.656-4.5c1.583-2.332%202.63-3.558%203.188-4.25M11%2019c0%202.746%202.254%205%205%205v-2a3%203%200%200%201-3-3z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/la/tint.svg?color=%231a73e8&size=48
