Cool Button アイコン
noto-v1:cool-button
Cool Button アイコン(noto-v1:cool-button)は、Noto Emoji (v1) セットの無料 SVG アイコンです（作者: Google Inc）。 128 × 128 のグリッドで描かれています。 Noto Emoji (v1) icons は Apache 2.0 ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
- アイコンセット
- Noto Emoji (v1)
- 作者
- Google Inc
- ライセンス
- Apache-2.0
- サイズ
- 128 × 128
- カテゴリ
- 記号
- タグ
- coolbutton
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="128" height="128" viewBox="0 0 128 128"><path fill="#40c0e7" d="M121.03 0H7.02C3.24 0 .14 3.09.14 6.88v114.01c0 3.79 3.1 6.88 6.88 6.88h114.01c3.78 0 6.88-3.09 6.88-6.88V6.88c0-3.79-3.1-6.88-6.88-6.88"/><g fill="#fff"><path d="M35.69 77.11c-.25-.04-.49.1-.6.33c-2 4.29-5.09 8.64-7.14 8.64c-4.07 0-7.01-9.55-7.01-22.69s2.95-22.68 7.01-22.68c1.87 0 4.25 2.72 6.37 7.28c.1.23.35.36.59.33c.25-.03.45-.21.5-.46l3.69-18.24c.02-.12.01-.25-.04-.36c-2.8-6-6.54-9.04-11.14-9.04c-9.87 0-16.76 17.74-16.76 43.17c0 25.42 6.89 43.17 16.76 43.17c4.55 0 8.44-3.66 11.56-10.88c.05-.1.06-.22.04-.33l-3.33-17.77a.58.58 0 0 0-.5-.47"/><path d="M51.63 20.73c-7.59 0-12.34 19.32-12.34 43.16c0 23.83 4.75 43.15 12.34 43.15c7.6 0 12.34-19.32 12.34-43.15c.01-23.85-4.74-43.16-12.34-43.16m0 67.88c-2.45 0-3.98-11.07-3.98-24.73c0-13.65 1.53-24.72 3.98-24.72s3.99 11.07 3.99 24.72c0 13.66-1.54 24.73-3.99 24.73m64.07 1.25h-13.02V22.15c0-.61-.49-1.1-1.1-1.1h-6.46c-.61 0-1.1.49-1.1 1.1v82.47c0 .61.49 1.1 1.1 1.1h20.57c.61 0 1.1-.49 1.1-1.1V90.96c.01-.61-.48-1.1-1.09-1.1M78.99 20.73c-7.59 0-12.34 19.32-12.34 43.16c0 23.83 4.75 43.15 12.34 43.15c7.6 0 12.34-19.32 12.34-43.15c0-23.85-4.75-43.16-12.34-43.16m0 67.88c-2.45 0-3.98-11.07-3.98-24.73c0-13.65 1.54-24.72 3.98-24.72c2.45 0 3.99 11.07 3.99 24.72c-.01 13.66-1.54 24.73-3.99 24.73"/></g></svg>
Cool Button アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="noto-v1:cool-button" width="24" />
Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="noto-v1:cool-button" width="24" />
</template>
Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="noto-v1:cool-button" width="24" />
Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[noto-v1--cool-button]"></span>
UnoCSS
<!-- @unocss/preset-icons + @iconify-json/noto-v1 -->
<div class="i-noto-v1:cool-button"></div>
Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="noto-v1:cool-button"></iconify-icon>
HTML 画像
<img src="https://iconyz.com/api/public/svg/noto-v1/cool-button.svg" alt="Cool Button アイコン" width="24" height="24">
他のアイコンセットの Cool Button アイコン
Cool Button アイコン のよくある質問
Cool Button アイコンは商用利用でも無料ですか?
はい。Noto Emoji (v1) icons は Apache 2.0 ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Cool Button アイコンを使うには?
@iconify/react をインストールして <Icon icon="noto-v1:cool-button" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Cool Button アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/noto-v1/cool-button.svg" alt="Cool Button アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。
Noto Emoji (v1) アイコン をすべて見る →
ICONYZ
