search icon
search-sharp from IonIcons by Ben Sperry · Sharp · MIT Free for personal and commercial use.
- Name
- search-sharp
- Set
- IonIcons
- Style
- Sharp
- Viewbox
- 512×512
- License
- MIT
2 other variants in IonIcons
The same icon in other sets
searchAkar Iconssearch-outlinedAnt Design IconssearchBootstrap IconssearchBoxIcons v2searchBoxIcons v2 SolidsearchCarbonsearchCatppuccin IconssearchCodiconssearchElement Plussearch-fillEva IconssearchFramework7 IconssearchFont Awesome SolidsearchFeather Iconssearch-outlineFlowbite Iconssearch-12-filledFluent UI System Iconssearchcss.ggsearchHumbleiconssearchIconParksearchIconPark OutlinesearchIconPark SolidsearchIconPark TwoTonesearchIconoirsearchJam IconssearchLine Awesome
Related icons in IonIcons
Use the search icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M464 428L339.92 303.9a160.48 160.48 0 0 0 30.72-94.58C370.64 120.37 298.27 48 209.32 48S48 120.37 48 209.32s72.37 161.32 161.32 161.32a160.48 160.48 0 0 0 94.58-30.72L428 464ZM209.32 319.69a110.38 110.38 0 1 1 110.37-110.37a110.5 110.5 0 0 1-110.37 110.37"/></svg>
React
import type { SVGProps } from "react";
export function IonSearchSharp(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M464 428L339.92 303.9a160.48 160.48 0 0 0 30.72-94.58C370.64 120.37 298.27 48 209.32 48S48 120.37 48 209.32s72.37 161.32 161.32 161.32a160.48 160.48 0 0 0 94.58-30.72L428 464ZM209.32 319.69a110.38 110.38 0 1 1 110.37-110.37a110.5 110.5 0 0 1-110.37 110.37"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M464 428L339.92 303.9a160.48 160.48 0 0 0 30.72-94.58C370.64 120.37 298.27 48 209.32 48S48 120.37 48 209.32s72.37 161.32 161.32 161.32a160.48 160.48 0 0 0 94.58-30.72L428 464ZM209.32 319.69a110.38 110.38 0 1 1 110.37-110.37a110.5 110.5 0 0 1-110.37 110.37"/></svg> </template>
CSS
.icon-search-sharp {
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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M464%20428L339.92%20303.9a160.48%20160.48%200%200%200%2030.72-94.58C370.64%20120.37%20298.27%2048%20209.32%2048S48%20120.37%2048%20209.32s72.37%20161.32%20161.32%20161.32a160.48%20160.48%200%200%200%2094.58-30.72L428%20464ZM209.32%20319.69a110.38%20110.38%200%201%201%20110.37-110.37a110.5%20110.5%200%200%201-110.37%20110.37%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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M464%20428L339.92%20303.9a160.48%20160.48%200%200%200%2030.72-94.58C370.64%20120.37%20298.27%2048%20209.32%2048S48%20120.37%2048%20209.32s72.37%20161.32%20161.32%20161.32a160.48%20160.48%200%200%200%2094.58-30.72L428%20464ZM209.32%20319.69a110.38%20110.38%200%201%201%20110.37-110.37a110.5%20110.5%200%200%201-110.37%20110.37%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ion/search-sharp.svg?color=%231a73e8&size=48
