Animal Rabbit icon

Use the Animal Rabbit icon in React

Install Microsoft's @fluentui/react-icons package, then import the component. Icons inherit the current text color, and you can size them with CSS.

npm install @fluentui/react-icons

import { AnimalRabbit24Regular, AnimalRabbit24Filled } from "@fluentui/react-icons";

export function Example() {
  return <AnimalRabbit24Regular aria-label="Animal Rabbit" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_animal_rabbit_24_regular.svg" width="24" height="24" alt="Animal Rabbit">

Or paste the SVG markup inline. Setting fill="currentColor" makes the icon follow the text color of its parent:

<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.75 19.0003C6.28747 19.0003 5.0916 17.8586 5.00502 16.4178L5 16.2503L4.99952 14.9993C3.34293 14.9993 2 13.6564 2 11.9998C2 10.3432 3.34293 9.00028 4.99952 9.00028C6.07373 9.00028 7.03118 9.56906 7.56188 10.4391C8.07405 10.1929 8.64185 10.0416 9.24125 10.0076L9.5 10.0003H13.4995L13.7475 10.007L13.9935 10.0272L14.12 10.0443L14.23 9.87707L14.361 9.69928L12.584 7.92235C11.8843 7.22265 11.8107 6.13398 12.3631 5.35239L12.4671 5.21779L12.584 5.09042C13.3249 4.34956 14.5018 4.31057 15.2886 4.97344L15.416 5.09042L20.8284 10.5029C22.3905 12.065 22.3905 14.5976 20.8284 16.1597C20.1082 16.88 19.1629 17.282 18.1865 17.3273L17.9607 17.3314L17.779 17.3243L17.7528 17.3884C17.3675 18.2375 16.5642 18.8498 15.6146 18.9762L15.4228 18.9949L15.2495 19.0003H7.75ZM14.3553 6.15108C14.1591 5.95485 13.8409 5.95485 13.6447 6.15108C13.4703 6.3255 13.4509 6.59626 13.5866 6.7921L13.6447 6.86169L16.4528 9.6699L15.8149 10.3115C15.605 10.5215 15.4295 10.7558 15.2916 11.008L15.1952 11.2003L14.9287 11.7841L14.3107 11.6111C14.1146 11.5561 13.9126 11.5213 13.7066 11.5073L13.4995 11.5003H9.5C8.80076 11.5003 8.15739 11.7395 7.64728 12.1406L7.50409 12.2607L7.33898 12.4194L7.24566 12.5208L7.13486 12.6544L7.01378 12.8206L6.97161 12.8849C6.93089 12.9485 6.89251 13.0137 6.85658 13.0805L6.79897 13.1929L6.73697 13.3297L6.70271 13.414L6.65152 13.556L6.59714 13.7398C6.57164 13.8374 6.551 13.9367 6.53542 14.0373L6.52384 14.1203L6.50602 14.3087L6.5 14.5003V16.2503C6.5 16.8975 6.99187 17.4298 7.62219 17.4938L7.75 17.5003L12.001 17.4999L12.0019 17.2537C12.0019 16.6064 11.51 16.0741 10.8797 16.0101L10.7519 16.0037H9.75188C9.33767 16.0037 9.00188 15.6679 9.00188 15.2537C9.00188 14.874 9.28403 14.5602 9.65011 14.5105L9.75188 14.5037H10.7519C12.2144 14.5037 13.4103 15.6454 13.4969 17.0861L13.5019 17.2537L13.501 17.4999L15.2495 17.5003C15.8415 17.5003 16.344 17.0863 16.4678 16.5249L16.4885 16.4025L16.5872 15.5623L17.4095 15.7611C18.2518 15.9646 19.144 15.7228 19.7678 15.0991C20.7016 14.1652 20.7422 12.6763 19.8896 11.6942L19.7678 11.5635L14.3553 6.15108ZM4.99952 10.5003C4.17136 10.5003 3.5 11.1716 3.5 11.9998C3.5 12.7792 4.0947 13.4198 4.8551 13.4925L4.99952 13.4993L5.114 13.4943L5.11885 13.4685C5.15379 13.3196 5.19612 13.1735 5.24544 13.0307L5.34236 12.7762L5.44825 12.5405L5.50494 12.4272L5.63589 12.1928L5.72326 12.0527L5.86824 11.8426L5.94157 11.7454L6.05002 11.6109L6.17893 11.4637L6.329 11.3073C6.1194 10.9062 5.73907 10.6177 5.29202 10.5289L5.14067 10.5069L4.99952 10.5003Z" fill="currentColor"/></svg>

Use it from the SVG package

Microsoft's @fluentui/svg-icons package contains the raw SVG files, which works well with bundlers that import SVGs:

npm install @fluentui/svg-icons

import icon from "@fluentui/svg-icons/icons/animal_rabbit_24_regular.svg";

Details

Keywords

petcreaturefastquickhop