Icon

Components: Icon

A utility component to display svg icons.

Icon.tsx
import Icon from "@/components/Icon";
 
export const MyIcon = () => (
  <Icon width={16} height={16} fill="red" stroke="none">
    <path d="M10.0635 4.47178C13.2907 2.61009 12.4884 0.355918 12.0658 0.0857322C11.6433 -0.184453 16.3174 0.135272 17.2237 1.74839C18.13 3.36151 16.4359 5.36495 13.9304 6.58056C11.425 7.79617 8.69918 8.49057 5.11587 9.81083C2.71768 10.6944 1.16548 14.3478 0.756748 15.4151C0.717726 15.517 0.571427 15.5198 0.532791 15.4177C-0.755335 12.0154 0.445516 9.05518 2.49628 7.9189C4.60539 6.75029 6.83642 6.33348 10.0635 4.47178Z" fill="currentColor"/>
    <path d="M22.9137 8.61352C23.8424 11.7873 22.695 14.0236 20.4383 15.4075C17.9741 16.9186 14.4557 17.9261 13.1033 19.0079C11.7508 20.0897 11.5042 20.1922 11.0513 21.5405C10.8876 22.0279 11.0476 22.3867 11.2501 22.8237C11.4527 23.2606 12.0595 23.6269 12.0453 23.7259C12.0311 23.8249 10.1376 23.8706 8.57214 23.3148C7.0067 22.759 6.20771 21.8532 6.20771 21.8532C5.41358 20.8077 6.20771 18.3938 8.925 17.273C11.6423 16.1522 14.9154 15.0953 18.3665 13.5628C20.8303 12.4687 22.33 9.31264 22.4165 8.63563C22.4661 8.35866 22.8339 8.34096 22.9137 8.61352Z" fill="currentColor"/>
    <path d="M19.7335 7.56409C20.218 6.31124 20.1663 4.69023 20.1094 4.26714C20.0526 3.84406 19.5136 6.5387 15.9797 8.70316C12.4459 10.8676 7.86524 11.8961 6.88856 12.37C5.91187 12.8438 5.09204 13.4432 4.11585 14.7868C3.13966 16.1303 3.02042 19.5169 3.26583 19.1305C3.51124 18.7441 3.8415 16.6863 7.54652 14.6237C11.2515 12.561 16.3392 11.1329 16.846 10.8676C17.88 10.3264 19.2489 8.81695 19.7335 7.56409Z" fill="currentColor"/>
  </Icon>
);