Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 | 486x 162x 162x | import React from "react";
type IconProps = {
width?: number;
height?: number;
stroke?: string;
isGradient?: boolean;
};
const SearchIcon = ({
width = 24,
height = 24,
stroke = "#A8A8A8",
isGradient = false,
}: IconProps) => {
Iif (isGradient)
return (
<svg
key={stroke}
width={width}
height={height}
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M15.3874 15.3939L20 20M4.76773 13.6644C5.87756 15.7054 8.04271 17.0909 10.5319 17.0909C14.1521 17.0909 17.0868 14.1604 17.0868 10.5455C17.0868 6.9305 14.1521 4 10.5319 4C7.09756 4 4.28008 6.6375 4 9.99473"
stroke="url(#searchIconGradient)"
strokeWidth="1.2"
strokeLinecap="round"
strokeLinejoin="round"
/>
<defs>
<linearGradient
id="searchIconGradient"
x1="3"
y1="3"
x2="21"
y2="21"
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#72ECF0" />
<stop offset="1" stopColor="#528DDF" />
</linearGradient>
</defs>
</svg>
);
return (
<svg
width={width}
height={height}
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M15.3874 15.3939L20 20M4.76773 13.6644C5.87756 15.7054 8.04271 17.0909 10.5319 17.0909C14.1521 17.0909 17.0868 14.1604 17.0868 10.5455C17.0868 6.9305 14.1521 4 10.5319 4C7.09756 4 4.28008 6.6375 4 9.99473"
stroke={stroke}
strokeWidth="1.2"
strokeLinecap="round"
strokeLinejoin="round"
/>
</svg>
);
};
export default SearchIcon;
|