Sleeping Face アイコン
streamline-emojis:sleeping-face
Sleeping Face アイコン(streamline-emojis:sleeping-face)は、Streamline Emojis セットの無料 SVG アイコンです（作者: Streamline）。 48 × 48 のグリッドで描かれています。 Streamline Emojis icons は CC BY 4.0 ライセンス で公開されています。作者のクレジットを表記すれば、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
- アイコンセット
- Streamline Emojis
- 作者
- Streamline
- ライセンス
- CC-BY-4.0
- サイズ
- 48 × 48
- カテゴリ
- スマイリー・人物
- タグ
- sleepingface
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48"><path fill="#45413c" d="M12.29 45.41a11.67 1.59 0 1 0 23.34 0a11.67 1.59 0 1 0-23.34 0" opacity=".15"/><path fill="#ffe500" d="M10.54 27.54a13.46 13.46 0 1 0 26.92 0a13.46 13.46 0 1 0-26.92 0"/><path fill="#ebcb00" d="M24 14.09a13.46 13.46 0 1 0 13.46 13.45A13.46 13.46 0 0 0 24 14.09M24 39a12.28 12.28 0 1 1 12.28-12.3A12.28 12.28 0 0 1 24 39"/><path fill="none" stroke="#45413c" stroke-linecap="round" stroke-linejoin="round" d="M10.54 27.54a13.46 13.46 0 1 0 26.92 0a13.46 13.46 0 1 0-26.92 0"/><path fill="#ffb0ca" stroke="#45413c" stroke-linecap="round" stroke-linejoin="round" d="M18.62 34.1a5.38 5.38 0 1 0 10.76 0a5.38 5.38 0 1 0-10.76 0"/><path fill="#ff866e" stroke="#45413c" stroke-linecap="round" stroke-linejoin="round" d="M19.45 36.96a4.55 2.52 0 1 0 9.1 0a4.55 2.52 0 1 0-9.1 0"/><path fill="#ffaa54" d="M34.77 31.58c0 .56-.76 1-1.69 1s-1.68-.45-1.68-1s.75-1 1.68-1s1.69.42 1.69 1m-21.54 0c0 .56.76 1 1.69 1s1.68-.45 1.68-1s-.75-1-1.68-1s-1.69.42-1.69 1"/><path fill="#4aeff7" stroke="#45413c" stroke-linecap="round" stroke-linejoin="round" d="M25.68 39.57a1.77 1.77 0 0 1 1-1.58a1.8 1.8 0 0 0 .62-.52l.56-.74a.67.67 0 0 1 1.21.4V39a1.18 1.18 0 0 1-1.18 1.18a.5.5 0 0 0-.51.5v4.88a.84.84 0 0 1-1.68 0Z"/><path fill="none" stroke="#45413c" stroke-linecap="round" stroke-linejoin="round" d="M33.42 27.54a1.18 1.18 0 1 1-2.35 0m-14.13 0a1.18 1.18 0 0 1-2.36 0"/><path fill="#dabff5" stroke="#45413c" stroke-linejoin="round" d="m25.57 17.69l-5.93-1.13a.93.93 0 0 1-.38-1.66l5.43-4l-3.84-.73a1 1 0 0 1-.74-1.09a.93.93 0 0 1 1.09-.74l5.94 1.13a.93.93 0 0 1 .37 1.66l-5.43 4l3.84.73a.93.93 0 1 1-.35 1.83Zm-10.81 5.97L9.94 25.6a.8.8 0 0 1-1-1L11 19.15l-3.14 1.26a.8.8 0 0 1-1-.45a.79.79 0 0 1 .44-1L12.08 17a.8.8 0 0 1 1.05 1l-2.08 5.41l3.12-1.25a.8.8 0 1 1 .59 1.48Zm2.82-9.49L6.3 16.38a1.44 1.44 0 0 1-1.46-2.24L12 4L4.17 5.57a1.44 1.44 0 1 1-.55-2.83L14.9.53a1.43 1.43 0 0 1 1.46 2.23L9.25 12.87L17 11.34a1.44 1.44 0 0 1 .55 2.83Z"/><path fill="#eddbff" d="m4.19 4.29l11.29-2.22a1.47 1.47 0 0 1 1.08.24a1.44 1.44 0 0 0-.17-1.16a1.43 1.43 0 0 0-1.48-.62L3.62 2.74a1.44 1.44 0 0 0-.54 2.6a1.44 1.44 0 0 1 1.11-1.05"/><path fill="none" stroke="#45413c" stroke-linejoin="round" d="M17.58 14.17L6.3 16.38a1.44 1.44 0 0 1-1.46-2.24L12 4L4.17 5.57a1.44 1.44 0 1 1-.55-2.83L14.9.53a1.43 1.43 0 0 1 1.46 2.23L9.25 12.87L17 11.34a1.44 1.44 0 0 1 .55 2.83Z"/></svg>
Sleeping Face アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="streamline-emojis:sleeping-face" width="24" />
Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="streamline-emojis:sleeping-face" width="24" />
</template>
Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="streamline-emojis:sleeping-face" width="24" />
Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[streamline-emojis--sleeping-face]"></span>
UnoCSS
<!-- @unocss/preset-icons + @iconify-json/streamline-emojis -->
<div class="i-streamline-emojis:sleeping-face"></div>
Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="streamline-emojis:sleeping-face"></iconify-icon>
HTML 画像
<img src="https://iconyz.com/api/public/svg/streamline-emojis/sleeping-face.svg" alt="Sleeping Face アイコン" width="24" height="24">
他のアイコンセットの Sleeping Face アイコン
Sleeping Face アイコン のよくある質問
Sleeping Face アイコンは商用利用でも無料ですか?
はい。Streamline Emojis icons は CC BY 4.0 ライセンス で公開されています。作者のクレジットを表記すれば、個人・商用プロジェクトで利用できます。
React で Sleeping Face アイコンを使うには?
@iconify/react をインストールして <Icon icon="streamline-emojis:sleeping-face" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Sleeping Face アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/streamline-emojis/sleeping-face.svg" alt="Sleeping Face アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。
Streamline Emojis アイコン をすべて見る →
ICONYZ
