Cold Face アイコン
fluent-emoji:cold-face
Cold Face アイコン(fluent-emoji:cold-face)は、Fluent Emoji セットの無料 SVG アイコンです（作者: Microsoft Corporation）。 32 × 32 のグリッドで描かれています。 Fluent Emoji icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
- アイコンセット
- Fluent Emoji
- 作者
- Microsoft Corporation
- ライセンス
- MIT
- サイズ
- 32 × 32
- タグ
- coldface
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><g fill="none"><g filter="url(#ieQxfqd)"><path fill="url(#i2bjkye)" fill-rule="evenodd" d="M29.998 15.999c0 3.865-1.166 7.364-3.498 9.897V28.5L26 30h-1.5l-1.226-1.634c-1.985 1.041-4.41 1.632-7.275 1.632a18.5 18.5 0 0 1-3.063-.246L12 31l-1.5.5l-.5-.5l-1-1v-1.494q-.57-.282-1.096-.612L7.5 28.5L6 29l-1-1.5v-2.18c-2-2.476-3-5.742-3-9.321C2 8.268 6.664 2 15.999 2c9.334 0 13.999 6.268 13.999 13.999" clip-rule="evenodd"/></g><circle cx="9" cy="15" r="5" fill="url(#ifJyMMd)"/><circle cx="19.5" cy="15.5" r="4.5" fill="url(#inYvKAc)"/><path fill="#fff" d="M10.5 18a4.5 4.5 0 1 0 0-9a4.5 4.5 0 0 0 0 9m11 0a4.5 4.5 0 1 0 0-9a4.5 4.5 0 0 0 0 9"/><path fill="url(#iDWZEqd)" d="M12 16a2 2 0 1 0 0-4a2 2 0 0 0 0 4"/><path fill="url(#iDWZEqd)" d="M20 16a2 2 0 1 0 0-4a2 2 0 0 0 0 4"/><path fill="url(#iPFCpBd)" stroke="url(#ik2sOjd)" stroke-width=".25" d="M29.873 15.999c0 3.841-1.159 7.308-3.466 9.814c-2.306 2.504-5.77 4.06-10.408 4.06s-8.102-1.556-10.408-4.06c-2.307-2.506-3.466-5.973-3.466-9.814S3.284 8.69 5.591 6.185c2.306-2.504 5.77-4.06 10.408-4.06s8.102 1.556 10.408 4.06c2.307 2.505 3.466 5.973 3.466 9.814Z"/><rect width="14" height="6" x="9" y="19" fill="#3A3E67" rx="3"/><path fill="url(#i5rzBxd)" fill-rule="evenodd" d="M20 19h-8a3 3 0 0 0-2.535 1.395l.193.58A1.5 1.5 0 0 0 11.081 22h9.838a1.5 1.5 0 0 0 1.423-1.026l.193-.579A3 3 0 0 0 20 19" clip-rule="evenodd"/><path fill="url(#ijeWO4c)" fill-rule="evenodd" d="M12 25h8q.395-.001.762-.098a1.5 1.5 0 0 0 .947-1.155l.194-1.165a.5.5 0 0 0-.494-.582H10.59a.5.5 0 0 0-.492.582l.194 1.165c.09.538.46.97.945 1.155q.367.097.764.098" clip-rule="evenodd"/><path stroke="url(#iXYEvcd)" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.25" d="M10.5 5.5s-.5 3-4 3"/><path stroke="url(#i8AYw1b)" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.25" d="M10.5 5.5s-.5 3-4 3"/><path stroke="url(#ibGuudc)" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.25" d="M21.5 5.5s.5 3 4 3"/><defs><radialGradient id="i2bjkye" cx="0" cy="0" r="1" gradientTransform="rotate(136.548 11.158 10.53)scale(26.1725 40.9348)" gradientUnits="userSpaceOnUse"><stop stop-color="#BCDFFF"/><stop offset=".457" stop-color="#BDB5FF"/><stop offset="1" stop-color="#AE89FF"/></radialGradient><radialGradient id="ifJyMMd" cx="0" cy="0" r="1" gradientTransform="matrix(-5.49995 6.00004 -3.10542 -2.8466 11.5 12)" gradientUnits="userSpaceOnUse"><stop offset=".309" stop-color="#765FD7"/><stop offset="1" stop-color="#765FD7" stop-opacity="0"/></radialGradient><radialGradient id="inYvKAc" cx="0" cy="0" r="1" gradientTransform="matrix(-4.94996 5.40004 -2.79488 -2.56193 21.75 12.8)" gradientUnits="userSpaceOnUse"><stop offset=".053" stop-color="#765FD7"/><stop offset="1" stop-color="#765FD7" stop-opacity="0"/></radialGradient><radialGradient id="ik2sOjd" cx="0" cy="0" r="1" gradientTransform="matrix(0 -15.5 15.5 0 16 28.5)" gradientUnits="userSpaceOnUse"><stop stop-color="#F4BCFF"/><stop offset="1" stop-color="#F4BCFF" stop-opacity="0"/></radialGradient><radialGradient id="i8AYw1b" cx="0" cy="0" r="1" gradientTransform="matrix(2.5 3.5 -3.5 2.5 7 5)" gradientUnits="userSpaceOnUse"><stop offset=".542" stop-color="#493032"/><stop offset=".807" stop-color="#5E445A"/><stop offset=".955" stop-color="#4A2C42"/></radialGradient><radialGradient id="ibGuudc" cx="0" cy="0" r="1" gradientTransform="rotate(125.538 11.213 8.933)scale(4.30116)" gradientUnits="userSpaceOnUse"><stop stop-color="#C2B4B5"/><stop offset=".887" stop-color="#462B45"/><stop offset="1" stop-color="#4A2C42"/></radialGradient><linearGradient id="iDWZEqd" x1="20.615" x2="19.927" y1="12" y2="16.03" gradientUnits="userSpaceOnUse"><stop stop-color="#553B3E"/><stop offset="1" stop-color="#3D2432"/></linearGradient><linearGradient id="iPFCpBd" x1="15.999" x2="15.999" y1="2" y2="11" gradientUnits="userSpaceOnUse"><stop stop-color="#5DA0FF"/><stop offset="1" stop-color="#5DA0FF" stop-opacity="0"/></linearGradient><linearGradient id="i5rzBxd" x1="17.867" x2="17.867" y1="21" y2="22" gradientUnits="userSpaceOnUse"><stop stop-color="#FFF2FF"/><stop offset=".717" stop-color="#FFECFF"/><stop offset=".988" stop-color="#383B64"/></linearGradient><linearGradient id="ijeWO4c" x1="17.971" x2="17.971" y1="22" y2="27" gradientUnits="userSpaceOnUse"><stop stop-color="#FFF7FF"/><stop offset="1" stop-color="#FFE1FF"/></linearGradient><linearGradient id="iXYEvcd" x1="9.5" x2="9.5" y1="5" y2="6.5" gradientUnits="userSpaceOnUse"><stop offset=".03" stop-color="#524049"/><stop offset="1" stop-color="#4A2C42"/></linearGradient><filter id="ieQxfqd" width="28.998" height="31.5" x="2" y="2" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dx="1" dy="2"/><feGaussianBlur stdDeviation="1.25"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.16 0"/><feBlend in2="shape" result="effect1_innerShadow_31_131"/></filter></defs></g></svg>Cold Face アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="fluent-emoji:cold-face" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="fluent-emoji:cold-face" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="fluent-emoji:cold-face" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[fluent-emoji--cold-face]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/fluent-emoji -->
<div class="i-fluent-emoji:cold-face"></div>Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="fluent-emoji:cold-face"></iconify-icon>HTML 画像
<img src="https://iconyz.com/api/public/svg/fluent-emoji/cold-face.svg" alt="Cold Face アイコン" width="24" height="24">他のアイコンセットの Cold Face アイコン
Cold Face アイコン のよくある質問
Cold Face アイコンは商用利用でも無料ですか?
はい。Fluent Emoji icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Cold Face アイコンを使うには?
@iconify/react をインストールして <Icon icon="fluent-emoji:cold-face" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Cold Face アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/fluent-emoji/cold-face.svg" alt="Cold Face アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。