Black Nib アイコン

Q: Black Nib アイコンは商用利用でも無料ですか?

はい。Fluent Emoji icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。

fluent-emoji:black-nib

Black Nib アイコン(fluent-emoji:black-nib)は、Fluent Emoji セットの無料 SVG アイコンです（作者: Microsoft Corporation）。 32 × 32 のグリッドで描かれています。 Fluent Emoji icons は MIT ライセンスで公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。

アイコンセット: Fluent Emoji
作者: Microsoft Corporation
ライセンス: MIT
サイズ: 32 × 32
タグ: blacknib

SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><g fill="none"><rect width="15.606" height="10.025" x="20.164" y="1.051" fill="url(#ii1eYac)" rx="2.5" transform="rotate(45 20.164 1.05)"/><rect width="15.606" height="10.025" x="20.164" y="1.051" fill="url(#iVeHhsb)" rx="2.5" transform="rotate(45 20.164 1.05)"/><rect width="15.606" height="10.025" x="20.164" y="1.051" fill="url(#iS6Ddld)" rx="2.5" transform="rotate(45 20.164 1.05)"/><rect width="15.606" height="10.025" x="20.164" y="1.051" fill="url(#ikcoq0d)" rx="2.5" transform="rotate(45 20.164 1.05)"/><g filter="url(#iLe36Bc)"><path fill="#B2A6BB" d="m15.191 9.531l7.438 7.719l-4.691 7.666a3 3 0 0 1-1.72 1.315L3.623 29.898a1 1 0 0 1-1.24-1.237L6.01 16.099a3 3 0 0 1 1.31-1.723z"/></g><path fill="url(#izppGtc)" d="m15.191 9.531l7.438 7.719l-4.691 7.666a3 3 0 0 1-1.72 1.315L3.623 29.898a1 1 0 0 1-1.24-1.237L6.01 16.099a3 3 0 0 1 1.31-1.723z"/><path fill="url(#iPpswGd)" d="m15.191 9.531l7.438 7.719l-4.691 7.666a3 3 0 0 1-1.72 1.315L3.623 29.898a1 1 0 0 1-1.24-1.237L6.01 16.099a3 3 0 0 1 1.31-1.723z"/><path fill="url(#iWKrp4t)" d="m15.191 9.531l7.438 7.719l-4.691 7.666a3 3 0 0 1-1.72 1.315L3.623 29.898a1 1 0 0 1-1.24-1.237L6.01 16.099a3 3 0 0 1 1.31-1.723z"/><path fill="url(#iEM3IAd)" d="m15.191 9.531l7.438 7.719l-4.691 7.666a3 3 0 0 1-1.72 1.315L3.623 29.898a1 1 0 0 1-1.24-1.237L6.01 16.099a3 3 0 0 1 1.31-1.723z"/><g filter="url(#iuklNmc)"><path fill="url(#ilsokDd)" d="m25.941 17.344l-.063.063a2.5 2.5 0 0 1-3.535 0l-7.5-7.5a2.5 2.5 0 0 1 0-3.535l.063-.063z"/></g><path fill="url(#iZLqw3b)" d="m25.941 17.344l-.063.063a2.5 2.5 0 0 1-3.535 0l-7.5-7.5a2.5 2.5 0 0 1 0-3.535l.063-.063z"/><g filter="url(#i3yVMeq)"><path fill="url(#iMyZF2c)" d="M3.805 29.715c-.12.12-.267.219-.436.224a1.004 1.004 0 0 1-1.027-.987c-.001-.176.099-.332.223-.457l7.397-7.458c.237-.239.287-.6.21-.927a2.707 2.707 0 1 1 1.95 1.99c-.336-.088-.71-.04-.955.207z"/><path fill="url(#iSw7YKc)" d="M3.805 29.715c-.12.12-.267.219-.436.224a1.004 1.004 0 0 1-1.027-.987c-.001-.176.099-.332.223-.457l7.397-7.458c.237-.239.287-.6.21-.927a2.707 2.707 0 1 1 1.95 1.99c-.336-.088-.71-.04-.955.207z"/><path fill="url(#iE6O94c)" d="M3.805 29.715c-.12.12-.267.219-.436.224a1.004 1.004 0 0 1-1.027-.987c-.001-.176.099-.332.223-.457l7.397-7.458c.237-.239.287-.6.21-.927a2.707 2.707 0 1 1 1.95 1.99c-.336-.088-.71-.04-.955.207z"/></g><g filter="url(#i6HVL3d)"><rect width="12.838" height="1.746" x="20.676" y="2.578" fill="url(#ijV9VJc)" rx=".873" transform="rotate(45 20.676 2.578)"/></g><g filter="url(#iPtG6IB)"><circle cx="12.837" cy="19.531" r="2.063" stroke="url(#iMhExFe)" stroke-width=".3"/></g><g filter="url(#iHAatkb)"><path stroke="url(#ieoo4ub)" stroke-width=".3" d="M2.91 29.406L11.05 21"/></g><defs><linearGradient id="ii1eYac" x1="28.544" x2="27.616" y1="10.541" y2="1.128" gradientUnits="userSpaceOnUse"><stop stop-color="#513A63"/><stop offset="1" stop-color="#463E67"/></linearGradient><linearGradient id="iVeHhsb" x1="20.059" x2="22.998" y1="6.829" y2="6.807" gradientUnits="userSpaceOnUse"><stop offset=".438" stop-color="#3B3559"/><stop offset="1" stop-color="#463456" stop-opacity="0"/></linearGradient><linearGradient id="iS6Ddld" x1="35.814" x2="33.494" y1="5.57" y2="5.548" gradientUnits="userSpaceOnUse"><stop stop-color="#473C63"/><stop offset="1" stop-color="#473C63" stop-opacity="0"/></linearGradient><linearGradient id="ikcoq0d" x1="19.733" x2="21.071" y1="6.281" y2="6.253" gradientUnits="userSpaceOnUse"><stop stop-color="#5C5567"/><stop offset="1" stop-color="#5C5567" stop-opacity="0"/></linearGradient><linearGradient id="izppGtc" x1="8.691" x2="8.285" y1="29.313" y2="27.188" gradientUnits="userSpaceOnUse"><stop stop-color="#9F80BB"/><stop offset="1" stop-color="#9F80BB" stop-opacity="0"/></linearGradient><linearGradient id="iPpswGd" x1="3.722" x2="4.722" y1="22.75" y2="23.063" gradientUnits="userSpaceOnUse"><stop stop-color="#BEBDC0"/><stop offset="1" stop-color="#BEBDC0" stop-opacity="0"/></linearGradient><linearGradient id="iWKrp4t" x1="22.816" x2="20.66" y1="16.969" y2="18.813" gradientUnits="userSpaceOnUse"><stop offset=".227" stop-color="#886A8C"/><stop offset="1" stop-color="#A08EAA" stop-opacity="0"/></linearGradient><linearGradient id="ilsokDd" x1="18.537" x2="20.511" y1="13.548" y2="11.454" gradientUnits="userSpaceOnUse"><stop stop-color="#F2A65B"/><stop offset="1" stop-color="#F6AE5E"/></linearGradient><linearGradient id="iMyZF2c" x1="13.598" x2="2.691" y1="18.5" y2="29.469" gradientUnits="userSpaceOnUse"><stop stop-color="#898098"/><stop offset="1" stop-color="#9892A2"/></linearGradient><linearGradient id="iE6O94c" x1="3.004" x2="4.16" y1="27.781" y2="28.625" gradientUnits="userSpaceOnUse"><stop stop-color="#9083A3"/><stop offset="1" stop-color="#9083A3" stop-opacity="0"/></linearGradient><linearGradient id="ijV9VJc" x1="21.043" x2="33.38" y1="3.73" y2="3.393" gradientUnits="userSpaceOnUse"><stop stop-color="#5C5D7E"/><stop offset="1" stop-color="#646585"/></linearGradient><linearGradient id="iMhExFe" x1="10.519" x2="12.144" y1="20.359" y2="19.734" gradientUnits="userSpaceOnUse"><stop stop-color="#B3AEBB"/><stop offset="1" stop-color="#B3AEBB" stop-opacity="0"/></linearGradient><linearGradient id="ieoo4ub" x1="2.66" x2="12.428" y1="29.188" y2="19.648" gradientUnits="userSpaceOnUse"><stop stop-color="#B3AEBB"/><stop offset="1" stop-color="#B3AEBB" stop-opacity="0"/></linearGradient><filter id="iLe36Bc" width="21.036" height="21.408" x="2.342" y="8.531" 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=".5" dy="-1"/><feGaussianBlur stdDeviation="1.5"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.619608 0 0 0 0 0.494118 0 0 0 0 0.737255 0 0 0 1 0"/><feBlend in2="shape" result="effect1_innerShadow_18_22275"/><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="2.5"/><feGaussianBlur stdDeviation=".375"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.67451 0 0 0 0 0.65098 0 0 0 0 0.701961 0 0 0 1 0"/><feBlend in2="effect1_innerShadow_18_22275" result="effect2_innerShadow_18_22275"/></filter><filter id="iuklNmc" width="11.831" height="12.331" x="14.111" y="5.809" 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 dy="-.5"/><feGaussianBlur stdDeviation=".75"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.784314 0 0 0 0 0.443137 0 0 0 0 0.341176 0 0 0 1 0"/><feBlend in2="shape" result="effect1_innerShadow_18_22275"/></filter><filter id="i3yVMeq" width="13.719" height="13.717" x="1.842" y="16.272" 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="-.5" dy="-.5"/><feGaussianBlur stdDeviation=".5"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.388235 0 0 0 0 0.364706 0 0 0 0 0.427451 0 0 0 1 0"/><feBlend in2="shape" result="effect1_innerShadow_18_22275"/><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=".05" dy=".05"/><feGaussianBlur stdDeviation=".2"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.505882 0 0 0 0 0.486275 0 0 0 0 0.541176 0 0 0 1 0"/><feBlend in2="effect1_innerShadow_18_22275" result="effect2_innerShadow_18_22275"/></filter><filter id="i6HVL3d" width="12.589" height="12.589" x="18.303" y="1.44" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_18_22275" stdDeviation=".75"/></filter><filter id="iPtG6IB" width="5.625" height="5.625" x="10.024" y="16.719" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_18_22275" stdDeviation=".3"/></filter><filter id="iHAatkb" width="9.256" height="9.515" x="2.352" y="20.446" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_18_22275" stdDeviation=".225"/></filter><radialGradient id="iEM3IAd" cx="0" cy="0" r="1" gradientTransform="matrix(2.6875 -4.375 2.2188 1.36298 18.91 23.313)" gradientUnits="userSpaceOnUse"><stop stop-color="#BCAECB"/><stop offset="1" stop-color="#BCAECB" stop-opacity="0"/></radialGradient><radialGradient id="iZLqw3b" cx="0" cy="0" r="1" gradientTransform="matrix(-9.78381 -1.97383 2.4974 -12.379 23.895 9.842)" gradientUnits="userSpaceOnUse"><stop offset=".877" stop-color="#EEB481" stop-opacity="0"/><stop offset="1" stop-color="#EEB481"/></radialGradient><radialGradient id="iSw7YKc" cx="0" cy="0" r="1" gradientTransform="rotate(-63.453 27.096 7.875)scale(13.2149 7.46285)" gradientUnits="userSpaceOnUse"><stop offset=".77" stop-color="#887C98" stop-opacity="0"/><stop offset=".963" stop-color="#6C5981"/></radialGradient></defs></g></svg>

Black Nib アイコンの使い方

React

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

<Icon icon="fluent-emoji:black-nib" width="24" />

Vue

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

<template>
  <Icon icon="fluent-emoji:black-nib" width="24" />
</template>

Svelte

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

<Icon icon="fluent-emoji:black-nib" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[fluent-emoji--black-nib]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/fluent-emoji -->
<div class="i-fluent-emoji:black-nib"></div>

Web コンポーネント

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

<iconify-icon icon="fluent-emoji:black-nib"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/fluent-emoji/black-nib.svg" alt="Black Nib アイコン" width="24" height="24">

Fluent Emoji の関連アイコン

他のアイコンセットの Black Nib アイコン

Black Nib アイコンのよくある質問

Black Nib アイコンは商用利用でも無料ですか?

はい。Fluent Emoji icons は MIT ライセンスで公開されており、個人・商用プロジェクトで利用できます。

React で Black Nib アイコンを使うには?

@iconify/react をインストールして <Icon icon="fluent-emoji:black-nib" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。

Black Nib アイコンをウェブページに追加するには?

画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/fluent-emoji/black-nib.svg" alt="Black Nib アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。

Fluent Emoji アイコンをすべて見る →