glasses icon
glasses from BoxIcons v2 by Boxicons · Regular · MIT Free for personal and commercial use.
- Name
- glasses
- Set
- BoxIcons v2
- Style
- Regular
- Viewbox
- 24×24
- License
- MIT
- Aliases
- bx-glasses
The same icon in other sets
glassesAkar IconsglassesEmoji One (Colored)glassesFont Awesome 6 SolidglassesFont Awesome Solidglasses-16-filledFluent UI System IconsglassesFluent EmojiglassesFluent Emoji FlatglassesFluent Emoji High ContrastglassesFirefox OS EmojiglassesHuge IconsglassesIconParkglassesIconPark OutlineglassesIconPark SolidglassesIconPark TwoToneglassesIconoirglassesIonIconsglassesLine AwesomeglassesLucideglassesMaterial Design IconsglassesMyna UI IconsglassesNoto EmojiglassesOpenMojiglasses-fillRemix Iconglasses-boldSolar
Related icons in BoxIcons v2
Use the glasses icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="m21.977 13.783l-2-9A1 1 0 0 0 19 4h-3v2h2.198l.961 4.326A4.5 4.5 0 0 0 17.5 10c-1.953 0-3.603 1.258-4.224 3h-2.553c-.621-1.742-2.271-3-4.224-3c-.587 0-1.145.121-1.659.326L5.802 6H8V4H5a1 1 0 0 0-.976.783l-2 9l.047.011A4.6 4.6 0 0 0 2 14.5C2 16.981 4.019 19 6.5 19c2.31 0 4.197-1.756 4.449-4h2.102c.252 2.244 2.139 4 4.449 4c2.481 0 4.5-2.019 4.5-4.5c0-.242-.034-.475-.071-.706zM6.5 17C5.122 17 4 15.878 4 14.5S5.122 12 6.5 12S9 13.122 9 14.5S7.878 17 6.5 17m11 0c-1.379 0-2.5-1.122-2.5-2.5s1.121-2.5 2.5-2.5s2.5 1.122 2.5 2.5s-1.121 2.5-2.5 2.5"/></svg>
React
import type { SVGProps } from "react";
export function BxGlasses(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="m21.977 13.783l-2-9A1 1 0 0 0 19 4h-3v2h2.198l.961 4.326A4.5 4.5 0 0 0 17.5 10c-1.953 0-3.603 1.258-4.224 3h-2.553c-.621-1.742-2.271-3-4.224-3c-.587 0-1.145.121-1.659.326L5.802 6H8V4H5a1 1 0 0 0-.976.783l-2 9l.047.011A4.6 4.6 0 0 0 2 14.5C2 16.981 4.019 19 6.5 19c2.31 0 4.197-1.756 4.449-4h2.102c.252 2.244 2.139 4 4.449 4c2.481 0 4.5-2.019 4.5-4.5c0-.242-.034-.475-.071-.706zM6.5 17C5.122 17 4 15.878 4 14.5S5.122 12 6.5 12S9 13.122 9 14.5S7.878 17 6.5 17m11 0c-1.379 0-2.5-1.122-2.5-2.5s1.121-2.5 2.5-2.5s2.5 1.122 2.5 2.5s-1.121 2.5-2.5 2.5"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="m21.977 13.783l-2-9A1 1 0 0 0 19 4h-3v2h2.198l.961 4.326A4.5 4.5 0 0 0 17.5 10c-1.953 0-3.603 1.258-4.224 3h-2.553c-.621-1.742-2.271-3-4.224-3c-.587 0-1.145.121-1.659.326L5.802 6H8V4H5a1 1 0 0 0-.976.783l-2 9l.047.011A4.6 4.6 0 0 0 2 14.5C2 16.981 4.019 19 6.5 19c2.31 0 4.197-1.756 4.449-4h2.102c.252 2.244 2.139 4 4.449 4c2.481 0 4.5-2.019 4.5-4.5c0-.242-.034-.475-.071-.706zM6.5 17C5.122 17 4 15.878 4 14.5S5.122 12 6.5 12S9 13.122 9 14.5S7.878 17 6.5 17m11 0c-1.379 0-2.5-1.122-2.5-2.5s1.121-2.5 2.5-2.5s2.5 1.122 2.5 2.5s-1.121 2.5-2.5 2.5"/></svg> </template>
CSS
.icon-glasses {
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%22m21.977%2013.783l-2-9A1%201%200%200%200%2019%204h-3v2h2.198l.961%204.326A4.5%204.5%200%200%200%2017.5%2010c-1.953%200-3.603%201.258-4.224%203h-2.553c-.621-1.742-2.271-3-4.224-3c-.587%200-1.145.121-1.659.326L5.802%206H8V4H5a1%201%200%200%200-.976.783l-2%209l.047.011A4.6%204.6%200%200%200%202%2014.5C2%2016.981%204.019%2019%206.5%2019c2.31%200%204.197-1.756%204.449-4h2.102c.252%202.244%202.139%204%204.449%204c2.481%200%204.5-2.019%204.5-4.5c0-.242-.034-.475-.071-.706zM6.5%2017C5.122%2017%204%2015.878%204%2014.5S5.122%2012%206.5%2012S9%2013.122%209%2014.5S7.878%2017%206.5%2017m11%200c-1.379%200-2.5-1.122-2.5-2.5s1.121-2.5%202.5-2.5s2.5%201.122%202.5%202.5s-1.121%202.5-2.5%202.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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22m21.977%2013.783l-2-9A1%201%200%200%200%2019%204h-3v2h2.198l.961%204.326A4.5%204.5%200%200%200%2017.5%2010c-1.953%200-3.603%201.258-4.224%203h-2.553c-.621-1.742-2.271-3-4.224-3c-.587%200-1.145.121-1.659.326L5.802%206H8V4H5a1%201%200%200%200-.976.783l-2%209l.047.011A4.6%204.6%200%200%200%202%2014.5C2%2016.981%204.019%2019%206.5%2019c2.31%200%204.197-1.756%204.449-4h2.102c.252%202.244%202.139%204%204.449%204c2.481%200%204.5-2.019%204.5-4.5c0-.242-.034-.475-.071-.706zM6.5%2017C5.122%2017%204%2015.878%204%2014.5S5.122%2012%206.5%2012S9%2013.122%209%2014.5S7.878%2017%206.5%2017m11%200c-1.379%200-2.5-1.122-2.5-2.5s1.121-2.5%202.5-2.5s2.5%201.122%202.5%202.5s-1.121%202.5-2.5%202.5%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/bx/glasses.svg?color=%231a73e8&size=48
