platte from IconPark by ByteDance · Color · Components · Apache-2.0 Free for personal and commercial use.

Name
platte
Set
IconPark
Style
Color
Category
Components
Viewbox
48×48
License
Apache 2.0

The same icon in other sets

More components icons from IconPark

Use the platte icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none" stroke-linejoin="round" stroke-width="4"><path fill="#2F88FF" stroke="#000" d="M24 44C29.9601 44 26.3359 35.136 30 31C33.1264 27.4709 44 29.0856 44 24C44 12.9543 35.0457 4 24 4C12.9543 4 4 12.9543 4 24C4 35.0457 12.9543 44 24 44Z"/><path fill="#43CCF8" stroke="#fff" d="M28 17C29.6569 17 31 15.6569 31 14C31 12.3431 29.6569 11 28 11C26.3431 11 25 12.3431 25 14C25 15.6569 26.3431 17 28 17Z"/><path fill="#43CCF8" stroke="#fff" d="M16 21C17.6569 21 19 19.6569 19 18C19 16.3431 17.6569 15 16 15C14.3431 15 13 16.3431 13 18C13 19.6569 14.3431 21 16 21Z"/><path fill="#43CCF8" stroke="#fff" d="M17 34C18.6569 34 20 32.6569 20 31C20 29.3431 18.6569 28 17 28C15.3431 28 14 29.3431 14 31C14 32.6569 15.3431 34 17 34Z"/></g></svg>

React

import type { SVGProps } from "react";

export function IconParkPlatte(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none" strokeLinejoin="round" strokeWidth="4"><path fill="#2F88FF" stroke="#000" d="M24 44C29.9601 44 26.3359 35.136 30 31C33.1264 27.4709 44 29.0856 44 24C44 12.9543 35.0457 4 24 4C12.9543 4 4 12.9543 4 24C4 35.0457 12.9543 44 24 44Z"/><path fill="#43CCF8" stroke="#fff" d="M28 17C29.6569 17 31 15.6569 31 14C31 12.3431 29.6569 11 28 11C26.3431 11 25 12.3431 25 14C25 15.6569 26.3431 17 28 17Z"/><path fill="#43CCF8" stroke="#fff" d="M16 21C17.6569 21 19 19.6569 19 18C19 16.3431 17.6569 15 16 15C14.3431 15 13 16.3431 13 18C13 19.6569 14.3431 21 16 21Z"/><path fill="#43CCF8" stroke="#fff" d="M17 34C18.6569 34 20 32.6569 20 31C20 29.3431 18.6569 28 17 28C15.3431 28 14 29.3431 14 31C14 32.6569 15.3431 34 17 34Z"/></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none" stroke-linejoin="round" stroke-width="4"><path fill="#2F88FF" stroke="#000" d="M24 44C29.9601 44 26.3359 35.136 30 31C33.1264 27.4709 44 29.0856 44 24C44 12.9543 35.0457 4 24 4C12.9543 4 4 12.9543 4 24C4 35.0457 12.9543 44 24 44Z"/><path fill="#43CCF8" stroke="#fff" d="M28 17C29.6569 17 31 15.6569 31 14C31 12.3431 29.6569 11 28 11C26.3431 11 25 12.3431 25 14C25 15.6569 26.3431 17 28 17Z"/><path fill="#43CCF8" stroke="#fff" d="M16 21C17.6569 21 19 19.6569 19 18C19 16.3431 17.6569 15 16 15C14.3431 15 13 16.3431 13 18C13 19.6569 14.3431 21 16 21Z"/><path fill="#43CCF8" stroke="#fff" d="M17 34C18.6569 34 20 32.6569 20 31C20 29.3431 18.6569 28 17 28C15.3431 28 14 29.3431 14 31C14 32.6569 15.3431 34 17 34Z"/></g></svg>
</template>

CSS

.icon-platte {
  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%3Cg%20fill%3D%22none%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%3E%3Cpath%20fill%3D%22%232F88FF%22%20stroke%3D%22%23000%22%20d%3D%22M24%2044C29.9601%2044%2026.3359%2035.136%2030%2031C33.1264%2027.4709%2044%2029.0856%2044%2024C44%2012.9543%2035.0457%204%2024%204C12.9543%204%204%2012.9543%204%2024C4%2035.0457%2012.9543%2044%2024%2044Z%22%2F%3E%3Cpath%20fill%3D%22%2343CCF8%22%20stroke%3D%22%23fff%22%20d%3D%22M28%2017C29.6569%2017%2031%2015.6569%2031%2014C31%2012.3431%2029.6569%2011%2028%2011C26.3431%2011%2025%2012.3431%2025%2014C25%2015.6569%2026.3431%2017%2028%2017Z%22%2F%3E%3Cpath%20fill%3D%22%2343CCF8%22%20stroke%3D%22%23fff%22%20d%3D%22M16%2021C17.6569%2021%2019%2019.6569%2019%2018C19%2016.3431%2017.6569%2015%2016%2015C14.3431%2015%2013%2016.3431%2013%2018C13%2019.6569%2014.3431%2021%2016%2021Z%22%2F%3E%3Cpath%20fill%3D%22%2343CCF8%22%20stroke%3D%22%23fff%22%20d%3D%22M17%2034C18.6569%2034%2020%2032.6569%2020%2031C20%2029.3431%2018.6569%2028%2017%2028C15.3431%2028%2014%2029.3431%2014%2031C14%2032.6569%2015.3431%2034%2017%2034Z%22%2F%3E%3C%2Fg%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%3Cg%20fill%3D%22none%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%3E%3Cpath%20fill%3D%22%232F88FF%22%20stroke%3D%22%23000%22%20d%3D%22M24%2044C29.9601%2044%2026.3359%2035.136%2030%2031C33.1264%2027.4709%2044%2029.0856%2044%2024C44%2012.9543%2035.0457%204%2024%204C12.9543%204%204%2012.9543%204%2024C4%2035.0457%2012.9543%2044%2024%2044Z%22%2F%3E%3Cpath%20fill%3D%22%2343CCF8%22%20stroke%3D%22%23fff%22%20d%3D%22M28%2017C29.6569%2017%2031%2015.6569%2031%2014C31%2012.3431%2029.6569%2011%2028%2011C26.3431%2011%2025%2012.3431%2025%2014C25%2015.6569%2026.3431%2017%2028%2017Z%22%2F%3E%3Cpath%20fill%3D%22%2343CCF8%22%20stroke%3D%22%23fff%22%20d%3D%22M16%2021C17.6569%2021%2019%2019.6569%2019%2018C19%2016.3431%2017.6569%2015%2016%2015C14.3431%2015%2013%2016.3431%2013%2018C13%2019.6569%2014.3431%2021%2016%2021Z%22%2F%3E%3Cpath%20fill%3D%22%2343CCF8%22%20stroke%3D%22%23fff%22%20d%3D%22M17%2034C18.6569%2034%2020%2032.6569%2020%2031C20%2029.3431%2018.6569%2028%2017%2028C15.3431%2028%2014%2029.3431%2014%2031C14%2032.6569%2015.3431%2034%2017%2034Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/icon-park/platte.svg?color=%231a73e8&size=48