ICONYZ
日本語
Reicon の Pen Line アイコン

Pen Line アイコン

reicon:pen-line

Pen Line アイコン(reicon:pen-line)は、Reicon セットの無料 SVG アイコンです。 24 × 24 のグリッドで描かれています。 Reicon icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。

アイコンセット
Reicon
作者
REICON
ライセンス
MIT
サイズ
24 × 24
カテゴリ
テキスト書式
タグ
penline
SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g fill="currentColor"><path fill-rule="evenodd" d="m12.961 4.978l.009-.008l.008-.009l2.081-2.08c.378-.378.693-.694.971-.93c.29-.247.59-.451.95-.568a2.75 2.75 0 0 1 1.7 0c.36.117.66.322.95.568c.279.237.594.552.972.93l.517.517c.378.378.693.693.93.972c.246.29.451.59.568.95a2.75 2.75 0 0 1 0 1.7c-.117.36-.322.66-.568.95c-.237.278-.552.594-.93.971L9.131 20.93c-.159.159-.3.3-.463.414q-.218.15-.465.249a3.5 3.5 0 0 1-.601.156l-4.44.894c-.175.035-.352.07-.503.087c-.16.017-.394.027-.638-.073a1.25 1.25 0 0 1-.678-.678c-.1-.244-.09-.479-.073-.638c.016-.151.052-.328.087-.503l.894-4.44c.044-.22.083-.415.156-.601a2.3 2.3 0 0 1 .25-.465c.114-.164.253-.303.41-.46zm5.255-2.169a1.25 1.25 0 0 0-.772 0c-.097.032-.223.1-.443.286c-.226.192-.498.463-.903.867L14.561 5.5L18.5 9.44l1.537-1.538c.405-.404.676-.677.868-.903c.187-.22.254-.346.285-.443a1.25 1.25 0 0 0 0-.772c-.03-.097-.098-.224-.285-.443c-.192-.227-.463-.499-.868-.904l-.474-.474c-.405-.405-.677-.676-.904-.868c-.22-.187-.346-.254-.443-.286M17.44 10.5L13.5 6.56l-9.34 9.341c-.206.206-.245.248-.274.29a1 1 0 0 0-.083.155c-.018.047-.032.103-.09.393l-.895 4.443l4.443-.894c.29-.058.346-.073.393-.091a1 1 0 0 0 .155-.083c.042-.03.085-.068.293-.277z" clip-rule="evenodd"/><path d="M13 21.25a.75.75 0 0 0 0 1.5h9a.75.75 0 1 0 0-1.5z"/></g></svg>

Pen Line アイコンの使い方

React

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

<Icon icon="reicon:pen-line" width="24" />

Vue

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

<template>
  <Icon icon="reicon:pen-line" width="24" />
</template>

Svelte

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

<Icon icon="reicon:pen-line" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[reicon--pen-line]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/reicon -->
<div class="i-reicon:pen-line"></div>

Web コンポーネント

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

<iconify-icon icon="reicon:pen-line"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/reicon/pen-line.svg" alt="Pen Line アイコン" width="24" height="24">

Reicon の関連アイコン

他のアイコンセットの Pen Line アイコン

Pen Line アイコン のよくある質問

Pen Line アイコンは商用利用でも無料ですか?

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

React で Pen Line アイコンを使うには?

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

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

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

Reicon アイコン をすべて見る →