pill emoji
pill from Streamline Emojis by Streamline · Default · Objects · CC-BY-4.0 Attribution required.
- Name
- pill
- Set
- Streamline Emojis
- Style
- Default
- Category
- Objects
- Viewbox
- 48×48
- License
- CC BY 4.0
The same emoji in other sets
pillEmoji One (Colored)pill-16-filledFluent UI System IconspillFluent EmojipillFluent Emoji FlatpillFluent Emoji High ContrastpillFirefox OS Emojipillcss.ggpillHuge IconspillHumbleiconspillIconParkpillIconPark OutlinepillIconPark SolidpillIconPark TwoTonepillLucidepillMajesticonspillMaterial SymbolspillMaterial Symbols LightpillMaterial Design IconspillNoto EmojipillOpenMojipillPhosphorpill-boldSolarpillTabler IconspillTwitter Emoji
More objects icons from Streamline Emojis
Use the pill emoji
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><path fill="#45413c" d="M8.5 41.77a15.5 2.02 0 1 0 31 0a15.5 2.02 0 1 0-31 0" opacity=".15"/><path fill="#ff6242" d="M8.09 38.88a9.75 9.75 0 0 1 0-13.79l18-18a9.75 9.75 0 0 1 13.82 13.76l-18 18a9.75 9.75 0 0 1-13.82.03"/><path fill="#ff866e" d="m12.33 29.34l18-18A9.78 9.78 0 0 1 41.7 9.52a9.9 9.9 0 0 0-1.79-2.46a9.75 9.75 0 0 0-13.79 0l-18 18a9.75 9.75 0 0 0 0 13.79a9.9 9.9 0 0 0 2.46 1.79a9.75 9.75 0 0 1 1.75-11.3"/><path fill="#00b8f0" d="m26.12 7.06l-9 9l13.77 13.81l9-9A9.75 9.75 0 1 0 26.12 7.06"/><path fill="#4acfff" d="M41.7 9.52a9.9 9.9 0 0 0-1.79-2.46a9.75 9.75 0 0 0-13.79 0l-9 9l4.24 4.24l9-9A9.78 9.78 0 0 1 41.7 9.52"/><path fill="none" stroke="#45413c" stroke-linecap="round" stroke-linejoin="round" d="M39.91 7.06a9.75 9.75 0 0 1 0 13.79l-18 18A9.75 9.75 0 0 1 8.09 25.09l18-18a9.75 9.75 0 0 1 13.82-.03"/><path fill="none" stroke="#45413c" stroke-linecap="round" stroke-linejoin="round" d="m26.12 7.06l-9 9l13.77 13.81l9-9A9.75 9.75 0 1 0 26.12 7.06"/></svg>
React
import type { SVGProps } from "react";
export function StreamlineEmojisPill(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><path fill="#45413c" d="M8.5 41.77a15.5 2.02 0 1 0 31 0a15.5 2.02 0 1 0-31 0" opacity=".15"/><path fill="#ff6242" d="M8.09 38.88a9.75 9.75 0 0 1 0-13.79l18-18a9.75 9.75 0 0 1 13.82 13.76l-18 18a9.75 9.75 0 0 1-13.82.03"/><path fill="#ff866e" d="m12.33 29.34l18-18A9.78 9.78 0 0 1 41.7 9.52a9.9 9.9 0 0 0-1.79-2.46a9.75 9.75 0 0 0-13.79 0l-18 18a9.75 9.75 0 0 0 0 13.79a9.9 9.9 0 0 0 2.46 1.79a9.75 9.75 0 0 1 1.75-11.3"/><path fill="#00b8f0" d="m26.12 7.06l-9 9l13.77 13.81l9-9A9.75 9.75 0 1 0 26.12 7.06"/><path fill="#4acfff" d="M41.7 9.52a9.9 9.9 0 0 0-1.79-2.46a9.75 9.75 0 0 0-13.79 0l-9 9l4.24 4.24l9-9A9.78 9.78 0 0 1 41.7 9.52"/><path fill="none" stroke="#45413c" strokeLinecap="round" strokeLinejoin="round" d="M39.91 7.06a9.75 9.75 0 0 1 0 13.79l-18 18A9.75 9.75 0 0 1 8.09 25.09l18-18a9.75 9.75 0 0 1 13.82-.03"/><path fill="none" stroke="#45413c" strokeLinecap="round" strokeLinejoin="round" d="m26.12 7.06l-9 9l13.77 13.81l9-9A9.75 9.75 0 1 0 26.12 7.06"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><path fill="#45413c" d="M8.5 41.77a15.5 2.02 0 1 0 31 0a15.5 2.02 0 1 0-31 0" opacity=".15"/><path fill="#ff6242" d="M8.09 38.88a9.75 9.75 0 0 1 0-13.79l18-18a9.75 9.75 0 0 1 13.82 13.76l-18 18a9.75 9.75 0 0 1-13.82.03"/><path fill="#ff866e" d="m12.33 29.34l18-18A9.78 9.78 0 0 1 41.7 9.52a9.9 9.9 0 0 0-1.79-2.46a9.75 9.75 0 0 0-13.79 0l-18 18a9.75 9.75 0 0 0 0 13.79a9.9 9.9 0 0 0 2.46 1.79a9.75 9.75 0 0 1 1.75-11.3"/><path fill="#00b8f0" d="m26.12 7.06l-9 9l13.77 13.81l9-9A9.75 9.75 0 1 0 26.12 7.06"/><path fill="#4acfff" d="M41.7 9.52a9.9 9.9 0 0 0-1.79-2.46a9.75 9.75 0 0 0-13.79 0l-9 9l4.24 4.24l9-9A9.78 9.78 0 0 1 41.7 9.52"/><path fill="none" stroke="#45413c" stroke-linecap="round" stroke-linejoin="round" d="M39.91 7.06a9.75 9.75 0 0 1 0 13.79l-18 18A9.75 9.75 0 0 1 8.09 25.09l18-18a9.75 9.75 0 0 1 13.82-.03"/><path fill="none" stroke="#45413c" stroke-linecap="round" stroke-linejoin="round" d="m26.12 7.06l-9 9l13.77 13.81l9-9A9.75 9.75 0 1 0 26.12 7.06"/></svg> </template>
CSS
.icon-pill {
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%2048%2048%22%3E%3Cpath%20fill%3D%22%2345413c%22%20d%3D%22M8.5%2041.77a15.5%202.02%200%201%200%2031%200a15.5%202.02%200%201%200-31%200%22%20opacity%3D%22.15%22%2F%3E%3Cpath%20fill%3D%22%23ff6242%22%20d%3D%22M8.09%2038.88a9.75%209.75%200%200%201%200-13.79l18-18a9.75%209.75%200%200%201%2013.82%2013.76l-18%2018a9.75%209.75%200%200%201-13.82.03%22%2F%3E%3Cpath%20fill%3D%22%23ff866e%22%20d%3D%22m12.33%2029.34l18-18A9.78%209.78%200%200%201%2041.7%209.52a9.9%209.9%200%200%200-1.79-2.46a9.75%209.75%200%200%200-13.79%200l-18%2018a9.75%209.75%200%200%200%200%2013.79a9.9%209.9%200%200%200%202.46%201.79a9.75%209.75%200%200%201%201.75-11.3%22%2F%3E%3Cpath%20fill%3D%22%2300b8f0%22%20d%3D%22m26.12%207.06l-9%209l13.77%2013.81l9-9A9.75%209.75%200%201%200%2026.12%207.06%22%2F%3E%3Cpath%20fill%3D%22%234acfff%22%20d%3D%22M41.7%209.52a9.9%209.9%200%200%200-1.79-2.46a9.75%209.75%200%200%200-13.79%200l-9%209l4.24%204.24l9-9A9.78%209.78%200%200%201%2041.7%209.52%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%2345413c%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M39.91%207.06a9.75%209.75%200%200%201%200%2013.79l-18%2018A9.75%209.75%200%200%201%208.09%2025.09l18-18a9.75%209.75%200%200%201%2013.82-.03%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%2345413c%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22m26.12%207.06l-9%209l13.77%2013.81l9-9A9.75%209.75%200%201%200%2026.12%207.06%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%2048%2048%22%3E%3Cpath%20fill%3D%22%2345413c%22%20d%3D%22M8.5%2041.77a15.5%202.02%200%201%200%2031%200a15.5%202.02%200%201%200-31%200%22%20opacity%3D%22.15%22%2F%3E%3Cpath%20fill%3D%22%23ff6242%22%20d%3D%22M8.09%2038.88a9.75%209.75%200%200%201%200-13.79l18-18a9.75%209.75%200%200%201%2013.82%2013.76l-18%2018a9.75%209.75%200%200%201-13.82.03%22%2F%3E%3Cpath%20fill%3D%22%23ff866e%22%20d%3D%22m12.33%2029.34l18-18A9.78%209.78%200%200%201%2041.7%209.52a9.9%209.9%200%200%200-1.79-2.46a9.75%209.75%200%200%200-13.79%200l-18%2018a9.75%209.75%200%200%200%200%2013.79a9.9%209.9%200%200%200%202.46%201.79a9.75%209.75%200%200%201%201.75-11.3%22%2F%3E%3Cpath%20fill%3D%22%2300b8f0%22%20d%3D%22m26.12%207.06l-9%209l13.77%2013.81l9-9A9.75%209.75%200%201%200%2026.12%207.06%22%2F%3E%3Cpath%20fill%3D%22%234acfff%22%20d%3D%22M41.7%209.52a9.9%209.9%200%200%200-1.79-2.46a9.75%209.75%200%200%200-13.79%200l-9%209l4.24%204.24l9-9A9.78%209.78%200%200%201%2041.7%209.52%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%2345413c%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M39.91%207.06a9.75%209.75%200%200%201%200%2013.79l-18%2018A9.75%209.75%200%200%201%208.09%2025.09l18-18a9.75%209.75%200%200%201%2013.82-.03%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%2345413c%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22m26.12%207.06l-9%209l13.77%2013.81l9-9A9.75%209.75%200%201%200%2026.12%207.06%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/streamline-emojis/pill.svg?color=%231a73e8&size=48
