pets icon
pets from Material Symbols by Google · Regular · Social · Apache-2.0 Free for personal and commercial use.
- Name
- pets
- Set
- Material Symbols
- Style
- Regular
- Category
- Social
- Viewbox
- 24×24
- License
- Apache 2.0
- Aliases
- pets-outline, pets-outline-rounded, pets-outline-sharp, pets-rounded, pets-sharp
The same icon in other sets
More social icons from Material Symbols
Use the pets icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M4.5 12.125q-1.05 0-1.775-.725T2 9.625t.725-1.775T4.5 7.125t1.775.725T7 9.625T6.275 11.4t-1.775.725M7.225 7.4Q6.5 6.675 6.5 5.625t.725-1.775T9 3.125t1.775.725t.725 1.775t-.725 1.775T9 8.125T7.225 7.4m6 0q-.725-.725-.725-1.775t.725-1.775T15 3.125t1.775.725t.725 1.775t-.725 1.775T15 8.125T13.225 7.4m6.275 4.725q-1.05 0-1.775-.725T17 9.625t.725-1.775t1.775-.725t1.775.725T22 9.625t-.725 1.775t-1.775.725m-12.85 10q-1.125 0-1.888-.862T4 19.225q0-1.3.888-2.275t1.762-1.925q.725-.775 1.25-1.687t1.25-1.713q.55-.65 1.275-1.075T12 10.125t1.575.4t1.275 1.05q.7.8 1.238 1.725t1.262 1.725q.875.95 1.762 1.925T20 19.225q0 1.175-.763 2.038t-1.887.862q-1.35 0-2.675-.225T12 21.675t-2.675.225t-2.675.225"/></svg>
React
import type { SVGProps } from "react";
export function MaterialSymbolsPets(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="M4.5 12.125q-1.05 0-1.775-.725T2 9.625t.725-1.775T4.5 7.125t1.775.725T7 9.625T6.275 11.4t-1.775.725M7.225 7.4Q6.5 6.675 6.5 5.625t.725-1.775T9 3.125t1.775.725t.725 1.775t-.725 1.775T9 8.125T7.225 7.4m6 0q-.725-.725-.725-1.775t.725-1.775T15 3.125t1.775.725t.725 1.775t-.725 1.775T15 8.125T13.225 7.4m6.275 4.725q-1.05 0-1.775-.725T17 9.625t.725-1.775t1.775-.725t1.775.725T22 9.625t-.725 1.775t-1.775.725m-12.85 10q-1.125 0-1.888-.862T4 19.225q0-1.3.888-2.275t1.762-1.925q.725-.775 1.25-1.687t1.25-1.713q.55-.65 1.275-1.075T12 10.125t1.575.4t1.275 1.05q.7.8 1.238 1.725t1.262 1.725q.875.95 1.762 1.925T20 19.225q0 1.175-.763 2.038t-1.887.862q-1.35 0-2.675-.225T12 21.675t-2.675.225t-2.675.225"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M4.5 12.125q-1.05 0-1.775-.725T2 9.625t.725-1.775T4.5 7.125t1.775.725T7 9.625T6.275 11.4t-1.775.725M7.225 7.4Q6.5 6.675 6.5 5.625t.725-1.775T9 3.125t1.775.725t.725 1.775t-.725 1.775T9 8.125T7.225 7.4m6 0q-.725-.725-.725-1.775t.725-1.775T15 3.125t1.775.725t.725 1.775t-.725 1.775T15 8.125T13.225 7.4m6.275 4.725q-1.05 0-1.775-.725T17 9.625t.725-1.775t1.775-.725t1.775.725T22 9.625t-.725 1.775t-1.775.725m-12.85 10q-1.125 0-1.888-.862T4 19.225q0-1.3.888-2.275t1.762-1.925q.725-.775 1.25-1.687t1.25-1.713q.55-.65 1.275-1.075T12 10.125t1.575.4t1.275 1.05q.7.8 1.238 1.725t1.262 1.725q.875.95 1.762 1.925T20 19.225q0 1.175-.763 2.038t-1.887.862q-1.35 0-2.675-.225T12 21.675t-2.675.225t-2.675.225"/></svg> </template>
CSS
.icon-pets {
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%22M4.5%2012.125q-1.05%200-1.775-.725T2%209.625t.725-1.775T4.5%207.125t1.775.725T7%209.625T6.275%2011.4t-1.775.725M7.225%207.4Q6.5%206.675%206.5%205.625t.725-1.775T9%203.125t1.775.725t.725%201.775t-.725%201.775T9%208.125T7.225%207.4m6%200q-.725-.725-.725-1.775t.725-1.775T15%203.125t1.775.725t.725%201.775t-.725%201.775T15%208.125T13.225%207.4m6.275%204.725q-1.05%200-1.775-.725T17%209.625t.725-1.775t1.775-.725t1.775.725T22%209.625t-.725%201.775t-1.775.725m-12.85%2010q-1.125%200-1.888-.862T4%2019.225q0-1.3.888-2.275t1.762-1.925q.725-.775%201.25-1.687t1.25-1.713q.55-.65%201.275-1.075T12%2010.125t1.575.4t1.275%201.05q.7.8%201.238%201.725t1.262%201.725q.875.95%201.762%201.925T20%2019.225q0%201.175-.763%202.038t-1.887.862q-1.35%200-2.675-.225T12%2021.675t-2.675.225t-2.675.225%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%22M4.5%2012.125q-1.05%200-1.775-.725T2%209.625t.725-1.775T4.5%207.125t1.775.725T7%209.625T6.275%2011.4t-1.775.725M7.225%207.4Q6.5%206.675%206.5%205.625t.725-1.775T9%203.125t1.775.725t.725%201.775t-.725%201.775T9%208.125T7.225%207.4m6%200q-.725-.725-.725-1.775t.725-1.775T15%203.125t1.775.725t.725%201.775t-.725%201.775T15%208.125T13.225%207.4m6.275%204.725q-1.05%200-1.775-.725T17%209.625t.725-1.775t1.775-.725t1.775.725T22%209.625t-.725%201.775t-1.775.725m-12.85%2010q-1.125%200-1.888-.862T4%2019.225q0-1.3.888-2.275t1.762-1.925q.725-.775%201.25-1.687t1.25-1.713q.55-.65%201.275-1.075T12%2010.125t1.575.4t1.275%201.05q.7.8%201.238%201.725t1.262%201.725q.875.95%201.762%201.925T20%2019.225q0%201.175-.763%202.038t-1.887.862q-1.35%200-2.675-.225T12%2021.675t-2.675.225t-2.675.225%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/material-symbols/pets.svg?color=%231a73e8&size=48