settings compact icon
settings-compact from Codicons by Microsoft Corporation · Regular · CC-BY-4.0 Attribution required.
- Name
- settings-compact
- Set
- Codicons
- Style
- Regular
- Viewbox
- 12×12
- License
- CC BY 4.0
Related icons in Codicons
Use the settings compact icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 12 12"><path fill="currentColor" d="M1.5 4h4.59c.21.58.76 1 1.41 1s1.21-.42 1.41-1h1.59c.28 0 .5-.22.5-.5s-.22-.5-.5-.5H8.91c-.21-.58-.76-1-1.41-1s-1.21.42-1.41 1H1.5c-.28 0-.5.22-.5.5s.22.5.5.5m6-1c.28 0 .5.22.5.5s-.22.5-.5.5s-.5-.22-.5-.5s.22-.5.5-.5m3 5H5.91c-.21-.58-.76-1-1.41-1s-1.21.42-1.41 1H1.5c-.28 0-.5.22-.5.5s.22.5.5.5h1.59c.21.58.76 1 1.41 1s1.21-.42 1.41-1h4.59c.28 0 .5-.22.5-.5s-.22-.5-.5-.5m-6 1c-.28 0-.5-.22-.5-.5s.22-.5.5-.5s.5.22.5.5s-.22.5-.5.5"/></svg>
React
import type { SVGProps } from "react";
export function CodiconSettingsCompact(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 12 12"><path fill="currentColor" d="M1.5 4h4.59c.21.58.76 1 1.41 1s1.21-.42 1.41-1h1.59c.28 0 .5-.22.5-.5s-.22-.5-.5-.5H8.91c-.21-.58-.76-1-1.41-1s-1.21.42-1.41 1H1.5c-.28 0-.5.22-.5.5s.22.5.5.5m6-1c.28 0 .5.22.5.5s-.22.5-.5.5s-.5-.22-.5-.5s.22-.5.5-.5m3 5H5.91c-.21-.58-.76-1-1.41-1s-1.21.42-1.41 1H1.5c-.28 0-.5.22-.5.5s.22.5.5.5h1.59c.21.58.76 1 1.41 1s1.21-.42 1.41-1h4.59c.28 0 .5-.22.5-.5s-.22-.5-.5-.5m-6 1c-.28 0-.5-.22-.5-.5s.22-.5.5-.5s.5.22.5.5s-.22.5-.5.5"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 12 12"><path fill="currentColor" d="M1.5 4h4.59c.21.58.76 1 1.41 1s1.21-.42 1.41-1h1.59c.28 0 .5-.22.5-.5s-.22-.5-.5-.5H8.91c-.21-.58-.76-1-1.41-1s-1.21.42-1.41 1H1.5c-.28 0-.5.22-.5.5s.22.5.5.5m6-1c.28 0 .5.22.5.5s-.22.5-.5.5s-.5-.22-.5-.5s.22-.5.5-.5m3 5H5.91c-.21-.58-.76-1-1.41-1s-1.21.42-1.41 1H1.5c-.28 0-.5.22-.5.5s.22.5.5.5h1.59c.21.58.76 1 1.41 1s1.21-.42 1.41-1h4.59c.28 0 .5-.22.5-.5s-.22-.5-.5-.5m-6 1c-.28 0-.5-.22-.5-.5s.22-.5.5-.5s.5.22.5.5s-.22.5-.5.5"/></svg> </template>
CSS
.icon-settings-compact {
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%2012%2012%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M1.5%204h4.59c.21.58.76%201%201.41%201s1.21-.42%201.41-1h1.59c.28%200%20.5-.22.5-.5s-.22-.5-.5-.5H8.91c-.21-.58-.76-1-1.41-1s-1.21.42-1.41%201H1.5c-.28%200-.5.22-.5.5s.22.5.5.5m6-1c.28%200%20.5.22.5.5s-.22.5-.5.5s-.5-.22-.5-.5s.22-.5.5-.5m3%205H5.91c-.21-.58-.76-1-1.41-1s-1.21.42-1.41%201H1.5c-.28%200-.5.22-.5.5s.22.5.5.5h1.59c.21.58.76%201%201.41%201s1.21-.42%201.41-1h4.59c.28%200%20.5-.22.5-.5s-.22-.5-.5-.5m-6%201c-.28%200-.5-.22-.5-.5s.22-.5.5-.5s.5.22.5.5s-.22.5-.5.5%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%2012%2012%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M1.5%204h4.59c.21.58.76%201%201.41%201s1.21-.42%201.41-1h1.59c.28%200%20.5-.22.5-.5s-.22-.5-.5-.5H8.91c-.21-.58-.76-1-1.41-1s-1.21.42-1.41%201H1.5c-.28%200-.5.22-.5.5s.22.5.5.5m6-1c.28%200%20.5.22.5.5s-.22.5-.5.5s-.5-.22-.5-.5s.22-.5.5-.5m3%205H5.91c-.21-.58-.76-1-1.41-1s-1.21.42-1.41%201H1.5c-.28%200-.5.22-.5.5s.22.5.5.5h1.59c.21.58.76%201%201.41%201s1.21-.42%201.41-1h4.59c.28%200%20.5-.22.5-.5s-.22-.5-.5-.5m-6%201c-.28%200-.5-.22-.5-.5s.22-.5.5-.5s.5.22.5.5s-.22.5-.5.5%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/codicon/settings-compact.svg?color=%231a73e8&size=48
