Joplin アイコン
selfhst:joplin
Joplin アイコン(selfhst:joplin)は、selfh.st/icons セットの無料 SVG アイコンです（作者: selfh.st）。 512 × 512 のグリッドで描かれています。 selfh.st/icons は CC BY 4.0 ライセンス で公開されています。作者のクレジットを表記すれば、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
- アイコンセット
- selfh.st/icons
- 作者
- selfh.st
- ライセンス
- CC-BY-4.0
- サイズ
- 512 × 512
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><linearGradient id="SVGFQdVUc4w" x1="-552.852" x2="-552.102" y1="-5875.196" y2="-5875.196" gradientTransform="rotate(225 78141.418 -252389.056)scale(82.7393)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#004caf"/><stop offset="1" stop-color="#1f95f8"/></linearGradient><path fill="url(#SVGFQdVUc4w)" d="M387.4 512H124.6C56.1 512 0 455.9 0 387.4V124.6C0 56.1 56.1 0 124.6 0h262.8C455.9 0 512 56.1 512 124.6v262.8c0 68.5-56.1 124.6-124.6 124.6"/><path fill="#fff" d="M396.2 68.5H257c-1.3 0-2.4 1.1-2.4 2.4V115c0 1.5 1.2 2.7 2.7 2.7h19.1c7.7 0 14 5.9 14.6 13.5v209.1c0 1.7 0 3.3-.2 5c0 .2 0 .5-.1.7c-.1.9-.2 1.9-.4 2.8c-.1.5-.2 1-.4 1.6c-.2.7-.3 1.4-.5 2.1c-1.3 4-3.2 7.8-6 11l-.3.3c-.8 1-1.7 1.9-2.7 2.8s-2 1.7-3.1 2.5c-7.8 5.5-18.3 7.9-30 6.8c-14.9-1.4-29.7-8.2-41.7-19.1s-19.4-24.4-20.9-37.9c-1.4-12.1 2.3-22.8 10.2-30.1h.1c.3-.3.6-.5 1-.8c5.7-4.8 13.2-7.7 21.7-8.5h.3c.9-.1 1.8-.1 2.7-.1c.5 0 1-.1 1.4-.1h1.4c1.3 0 2.7.1 4.1.2h.5c.1 0 .2 0 .4.1c7.8.8 15.5 3.1 22.9 6.6c.1 0 .3 0 .6.2c2.2 1.2 2.7-.1 2.7-1v-66.5c0-1.9-1.3-3.6-3.2-4c-39.5-8.7-78.2.4-105.5 25.2c-23.9 21.7-35.4 53.1-31.7 86c3.3 29.3 18.4 57.5 42.4 79.3c23.4 21.3 53.2 34.6 83.9 37.5c4.2.4 8.5.6 12.6.6c29.3 0 56.6-10.1 76.6-28.3c19-17.3 30.4-41.1 32.1-67l.2-169.8v-46.2c.2-8 6.7-14.5 14.8-14.5H396c1.5 0 2.7-1.2 2.7-2.7V70.8c-.2-1.3-1.2-2.3-2.5-2.3"/></svg>Joplin アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="selfhst:joplin" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="selfhst:joplin" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="selfhst:joplin" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[selfhst--joplin]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/selfhst -->
<div class="i-selfhst:joplin"></div>Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="selfhst:joplin"></iconify-icon>HTML 画像
<img src="https://iconyz.com/api/public/svg/selfhst/joplin.svg" alt="Joplin アイコン" width="24" height="24">selfh.st/icons の関連アイコン
他のアイコンセットの Joplin アイコン
Joplin アイコン のよくある質問
Joplin アイコンは商用利用でも無料ですか?
はい。selfh.st/icons は CC BY 4.0 ライセンス で公開されています。作者のクレジットを表記すれば、個人・商用プロジェクトで利用できます。
React で Joplin アイコンを使うには?
@iconify/react をインストールして <Icon icon="selfhst:joplin" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Joplin アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/selfhst/joplin.svg" alt="Joplin アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。