natural mode icon
natural-mode from IconPark by ByteDance · Color · Edit · Apache-2.0 Free for personal and commercial use.
- Name
- natural-mode
- Set
- IconPark
- Style
- Color
- Category
- Edit
- Viewbox
- 48×48
- License
- Apache 2.0
The same icon in other sets
More edit icons from IconPark
Use the natural mode icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="#2F88FF" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"><path d="M24.0005 27C18.3431 27 14.065 22.6575 14.065 17L14 7L19.0005 11L24.0005 5L29.0005 11L34.0005 7V17C34.0005 22.6575 29.658 27 24.0005 27Z"/><path d="M23.4862 43.3137C25.0483 41.7516 23.1488 37.3195 19.2436 33.4142C15.3383 29.509 10.9062 27.6095 9.34408 29.1715C7.78199 30.7336 9.68146 35.1658 13.5867 39.0711C17.492 42.9763 21.9241 44.8758 23.4862 43.3137Z"/><path d="M24.8289 42.9706C26.391 44.5327 30.8231 42.6332 34.7283 38.7279C38.6336 34.8227 40.5331 30.3905 38.971 28.8285C37.4089 27.2664 32.9767 29.1658 29.0715 33.0711C25.1662 36.9763 23.2668 41.4085 24.8289 42.9706Z"/></g></svg>
React
import type { SVGProps } from "react";
export function IconParkNaturalMode(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="#2F88FF" stroke="#000" strokeLinecap="round" strokeLinejoin="round" strokeMiterlimit="10" strokeWidth="4"><path d="M24.0005 27C18.3431 27 14.065 22.6575 14.065 17L14 7L19.0005 11L24.0005 5L29.0005 11L34.0005 7V17C34.0005 22.6575 29.658 27 24.0005 27Z"/><path d="M23.4862 43.3137C25.0483 41.7516 23.1488 37.3195 19.2436 33.4142C15.3383 29.509 10.9062 27.6095 9.34408 29.1715C7.78199 30.7336 9.68146 35.1658 13.5867 39.0711C17.492 42.9763 21.9241 44.8758 23.4862 43.3137Z"/><path d="M24.8289 42.9706C26.391 44.5327 30.8231 42.6332 34.7283 38.7279C38.6336 34.8227 40.5331 30.3905 38.971 28.8285C37.4089 27.2664 32.9767 29.1658 29.0715 33.0711C25.1662 36.9763 23.2668 41.4085 24.8289 42.9706Z"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="#2F88FF" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"><path d="M24.0005 27C18.3431 27 14.065 22.6575 14.065 17L14 7L19.0005 11L24.0005 5L29.0005 11L34.0005 7V17C34.0005 22.6575 29.658 27 24.0005 27Z"/><path d="M23.4862 43.3137C25.0483 41.7516 23.1488 37.3195 19.2436 33.4142C15.3383 29.509 10.9062 27.6095 9.34408 29.1715C7.78199 30.7336 9.68146 35.1658 13.5867 39.0711C17.492 42.9763 21.9241 44.8758 23.4862 43.3137Z"/><path d="M24.8289 42.9706C26.391 44.5327 30.8231 42.6332 34.7283 38.7279C38.6336 34.8227 40.5331 30.3905 38.971 28.8285C37.4089 27.2664 32.9767 29.1658 29.0715 33.0711C25.1662 36.9763 23.2668 41.4085 24.8289 42.9706Z"/></g></svg> </template>
CSS
.icon-natural-mode {
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%22%232F88FF%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-miterlimit%3D%2210%22%20stroke-width%3D%224%22%3E%3Cpath%20d%3D%22M24.0005%2027C18.3431%2027%2014.065%2022.6575%2014.065%2017L14%207L19.0005%2011L24.0005%205L29.0005%2011L34.0005%207V17C34.0005%2022.6575%2029.658%2027%2024.0005%2027Z%22%2F%3E%3Cpath%20d%3D%22M23.4862%2043.3137C25.0483%2041.7516%2023.1488%2037.3195%2019.2436%2033.4142C15.3383%2029.509%2010.9062%2027.6095%209.34408%2029.1715C7.78199%2030.7336%209.68146%2035.1658%2013.5867%2039.0711C17.492%2042.9763%2021.9241%2044.8758%2023.4862%2043.3137Z%22%2F%3E%3Cpath%20d%3D%22M24.8289%2042.9706C26.391%2044.5327%2030.8231%2042.6332%2034.7283%2038.7279C38.6336%2034.8227%2040.5331%2030.3905%2038.971%2028.8285C37.4089%2027.2664%2032.9767%2029.1658%2029.0715%2033.0711C25.1662%2036.9763%2023.2668%2041.4085%2024.8289%2042.9706Z%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%22%232F88FF%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-miterlimit%3D%2210%22%20stroke-width%3D%224%22%3E%3Cpath%20d%3D%22M24.0005%2027C18.3431%2027%2014.065%2022.6575%2014.065%2017L14%207L19.0005%2011L24.0005%205L29.0005%2011L34.0005%207V17C34.0005%2022.6575%2029.658%2027%2024.0005%2027Z%22%2F%3E%3Cpath%20d%3D%22M23.4862%2043.3137C25.0483%2041.7516%2023.1488%2037.3195%2019.2436%2033.4142C15.3383%2029.509%2010.9062%2027.6095%209.34408%2029.1715C7.78199%2030.7336%209.68146%2035.1658%2013.5867%2039.0711C17.492%2042.9763%2021.9241%2044.8758%2023.4862%2043.3137Z%22%2F%3E%3Cpath%20d%3D%22M24.8289%2042.9706C26.391%2044.5327%2030.8231%2042.6332%2034.7283%2038.7279C38.6336%2034.8227%2040.5331%2030.3905%2038.971%2028.8285C37.4089%2027.2664%2032.9767%2029.1658%2029.0715%2033.0711C25.1662%2036.9763%2023.2668%2041.4085%2024.8289%2042.9706Z%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/natural-mode.svg?color=%231a73e8&size=48
