Cracking Face icon

noto:cracking-face

The Cracking Face icon (noto:cracking-face) is a free SVG icon from the Noto Emoji set by Google Inc. It is drawn on a 128 × 128 grid. Noto Emoji icons are released under the Apache 2.0 license, which allows use in personal and commercial projects. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.

Icon set: Noto Emoji
Author: Google Inc
License: Apache-2.0
Size: 128 × 128
Category: Smileys & Emotion
Tags: crackingface

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="128" height="128" viewBox="0 0 128 128"><path fill="#673627" d="M120.457 49.913L117.537 64l-6.919 10.977L89.822 64l3.36-7.104z"/><linearGradient id="SVG8wvwYdex" x1="106.418" x2="120.457" y1="61.458" y2="61.458" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#d47731"/><stop offset="1" stop-color="#d47731" stop-opacity="0"/></linearGradient><path fill="url(#SVG8wvwYdex)" d="m107.327 65.305l-.909 5.789l5.444 1.909L117.537 64l.984-4.75l1.936-9.337l-3.189.817l-9.556 8.718z"/><path fill="#673627" d="m121.665 70.63l-4.128 5.618l-6.647-2.809l1.385-6.295z"/><radialGradient id="SVGZFJPXb2n" cx="62.796" cy="63.144" r="56.997" gradientUnits="userSpaceOnUse"><stop offset=".5" stop-color="#fde030"/><stop offset=".919" stop-color="#f7c02b"/><stop offset="1" stop-color="#f4a223"/></radialGradient><path fill="url(#SVGZFJPXb2n)" d="M121.665 70.63c.217-2.162.335-4.37.335-6.63c0-3.696-.31-7.264-.885-10.703l-8.84 13.847z"/><path fill="#eb8f00" d="M120 61a65 65 0 0 1-.592 8.792l2.257.838c.217-2.162.335-4.37.335-6.63c0-3.698-.302-7.273-.879-10.714l-1.358 2.128c.153 1.83.237 3.69.237 5.586"/><path fill="#673627" d="m43.793 30.543l-2.829 7.655l-21.341 1.18l-5.201-6.267z"/><radialGradient id="SVG7o0d2rhs" cx="63.407" cy="63.592" r="57.2" gradientTransform="matrix(1 0 0 .97858 0 1.362)" gradientUnits="userSpaceOnUse"><stop offset=".5" stop-color="#fde030"/><stop offset=".919" stop-color="#f7c02b"/><stop offset="1" stop-color="#f4a223"/></radialGradient><path fill="url(#SVG7o0d2rhs)" d="M38.655 13.14c-9.67 4.076-18.28 10.68-24.233 19.971l29.37-2.568z"/><path fill="#673627" d="m86.273 116.032l-9.415-8.214V97.676l17.05-11.704l4.359-13.236l5.449 12.814l7.505 12.477l-9.503 1.006z"/><path fill="#a05320" d="M76.858 97.676v10.142l9.415 8.214l9.69-10.665a6705 6705 0 0 0-19.105-7.69"/><path fill="#d47731" d="m114.992 35.637l-1.55 5.194l-7.024 1.816l-9.604-5.902l-.454 2.088l5.148 1.954l2.935 9.125l-6.811 3.905l-7.81-24.701l2.724-2.997z"/><path fill="#673627" d="m108.342 37.013l.595-3.944l-18.572-4.551l6.449 8.227l9.556 5.873zM18.715 64L7.51 78.101l12.113 6.139l18.072-18.799l-2.088-4.208z"/><path fill="#a05320" d="m17.256 76.88l-8.712-.08l-1.034 1.301l12.113 6.139l2.876-2.992z"/><path fill="#d47731" d="m12.018 72.227l6.788-10.139L30.65 74.977l-6.44 7.67z"/><path fill="#a05320" d="m54.518 64.692l-8.766 7.376l-9.308 12.172l6.211 17.787l-14.038 7.641c1.65 1.24 6.494 3.55 6.494 3.55L57.15 104.7z"/><path fill="#eb8f00" d="m54.223 104.701l-11.568-2.674l-14.038 7.641c1.65 1.239 6.494 3.55 6.494 3.55l16.475-6.367c1.583-1.285 2.637-2.15 2.637-2.15"/><linearGradient id="SVGUnCdmcfD" x1="40.387" x2="45.473" y1="88.069" y2="99.149" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#d47731"/><stop offset="1" stop-color="#d47731" stop-opacity="0"/></linearGradient><path fill="url(#SVGUnCdmcfD)" d="m42.571 102.073l9.452 2.103l-8.078-17.585l-7.501-2.351l6.211 17.787z"/><path fill="#673627" d="m62.201 31.874l-4.489 22.457l11.495 1.303l7.651-40.566l-22.652-6.217l-6.839 7.551l-1.615 16.209z"/><linearGradient id="SVGgSdxpcBk" x1="63.381" x2="67.058" y1="50.64" y2="24.622" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#d47731"/><stop offset="1" stop-color="#d47731" stop-opacity="0"/></linearGradient><path fill="url(#SVGgSdxpcBk)" d="m63.363 54.971l2.227.253l5.888-28.06l-9.277 4.71l-3.23 16.156z"/><path fill="#d47731" d="M58.437 10.013L54.206 8.85l-6.84 7.551l-1.614 16.209l7.29-3.404s3.326-11.567 5.395-19.194"/><radialGradient id="SVGD3jYedzQ" cx="63.349" cy="64" r="56.629" gradientUnits="userSpaceOnUse"><stop offset=".5" stop-color="#fde030"/><stop offset=".919" stop-color="#f7c02b"/><stop offset="1" stop-color="#f4a223"/></radialGradient><path fill="url(#SVGD3jYedzQ)" d="M93.46 63.039c-.903-.492-.244-2.17.847-1.826s13.02 4.092 13.02 4.092l13.123-15.383a56 56 0 0 0-1.884-6.43l-10.65 1.516l-7.83 6.25c-.54.473-1.366-.04-1.18-.734l2.602-9.737L92.53 30.03c-.27-.376.151-.86.56-.643l15.253 7.627l6.647-1.376A50.5 50.5 0 0 0 104.4 22.5C93.8 13.2 79.5 8.1 64 8.1c-3.253 0-6.533.268-9.794.751l-1.2 20.197l.037.16l16.413-.896L64.848 52.5c-.232 1.217-1.271 1.056-1.57.082l-5.095-15.986l-46.132.637C8.243 44.657 6 53.548 6 64c0 5.065.537 9.756 1.51 14.101l9.746-1.22l5.361-10.387s9.808-1.813 10.655-1.972c1.381-.261 1.245.42.575.88s-7.613 4.984-7.613 4.984L20.17 82.137L8.94 83.35c2.596 7.88 6.779 14.424 11.998 19.694l15.505-7.012l-4.869-12.465l18.375-13.25c1.424-1.026 2.073-.36 1.675.462s-7.68 15.813-7.68 15.813l8.078 17.585l-16.926 9.049c8.965 4.497 19.07 6.675 28.903 6.675a66.3 66.3 0 0 0 14.518-1.6l3.351-18.304l13.71-10.55s2.257-10.348 2.621-11.611c.283-.982 2.054-.867 1.952.207c-.153 1.606-1.392 11.522-1.392 11.522l12.461 8.463c4.645-6.114 7.831-13.215 9.476-21.099c-7.113-3.62-26.502-13.488-27.238-13.89"/><path fill="#eb8f00" d="M62 116.9c-8.35 0-16.885-1.592-24.761-4.82l-2.128 1.137C44.075 117.711 54.17 119.9 64 119.9a66.3 66.3 0 0 0 14.518-1.6l.67-3.66A66 66 0 0 1 62 116.9m46.396-20.792l2.825 1.919c4.645-6.114 7.831-13.215 9.476-21.098l-2.387-1.215c-1.844 7.636-5.178 14.498-9.914 20.394m12.061-46.195a56 56 0 0 0-1.892-6.42l-.974.138a55 55 0 0 1 1.69 7.66z"/><radialGradient id="SVGRDzW1wtS" cx="66.163" cy="63.387" r="59.388" gradientTransform="matrix(1 0 0 .91565 0 5.347)" gradientUnits="userSpaceOnUse"><stop offset=".5" stop-color="#fde030"/><stop offset=".919" stop-color="#f7c02b"/><stop offset="1" stop-color="#f4a223"/></radialGradient><path fill="url(#SVGRDzW1wtS)" d="m87.29 102.07l-1.017 13.962c6.742-2.46 12.898-6.045 18.127-10.632a52 52 0 0 0 3.73-3.67l-11.146-8.36z"/><path fill="#eb8f00" d="M102.4 102.4c-4.633 4.065-9.993 7.346-15.844 9.753l-.283 3.88c6.742-2.46 12.898-6.045 18.127-10.633a52 52 0 0 0 3.73-3.67l-2.836-2.127c-.928.96-1.882 1.9-2.894 2.797"/><path fill="#422b0d" d="M44.444 42.04c-4.19 0-8 3.544-8 9.417s3.81 9.416 8 9.416c4.191 0 8-3.543 8-9.416s-3.809-9.416-8-9.416"/><path fill="#896024" d="M44.053 45.969c-1.033-.716-2.577-.494-3.58.954c-1.005 1.447-.671 2.972.362 3.688s2.577.494 3.58-.954c1.005-1.447.671-2.972-.362-3.688"/><path fill="#422b0d" d="M82.801 42.04c-4.19 0-8 3.544-8 9.417s3.81 9.416 8 9.416c4.191 0 8-3.543 8-9.416s-3.809-9.416-8-9.416"/><path fill="#896024" d="M82.41 45.969c-1.032-.716-2.577-.494-3.58.954s-.671 2.972.362 3.688s2.577.494 3.58-.954c1.005-1.447.671-2.972-.362-3.688"/><path fill="#422b0d" d="M87.615 80.313a1.83 1.83 0 0 0-1.646-1.08a1.84 1.84 0 0 0-.92.25c-4.811 2.771-12.879 6.205-21.514 6.205h-.137c-6.367 0-12.42-1.867-17.091-3.959l-2.245 4.622c4.829 3.61 11.486 6.36 19.36 6.36h.09c10.692 0 19.154-5.065 23.82-10.481a1.78 1.78 0 0 0 .283-1.917"/></svg>

How to use the Cracking Face icon

React

import { Icon } from "@iconify/react";

<Icon icon="noto:cracking-face" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="noto:cracking-face" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="noto:cracking-face" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[noto--cracking-face]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/noto -->
<div class="i-noto:cracking-face"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="noto:cracking-face"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/noto/cracking-face.svg" alt="Cracking Face icon" width="24" height="24">

Cracking Face icon in other icon sets

Cracking Face icon FAQ

Is the Cracking Face icon free for commercial use?

Yes. Noto Emoji icons are released under the Apache 2.0 license, which allows use in personal and commercial projects.

How do I use the Cracking Face icon in React?

Install @iconify/react and render <Icon icon="noto:cracking-face" />, or use “Copy code” on this page to get a standalone React component.

How do I add the Cracking Face icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/noto/cracking-face.svg" alt="Cracking Face icon">, or paste the SVG code inline to style it with CSS.

Browse all Noto Emoji icons →