ICONYZ
日本語
Health Icons の Heart Outline アイコン

Heart Outline アイコン

healthicons:heart-outline

Heart Outline アイコン(healthicons:heart-outline)は、Health Icons セットの無料 SVG アイコンです(作者: Resolve to Save Lives)。 48 × 48 のグリッドで描かれています。 Health Icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。

アイコンセット
Health Icons
作者
Resolve to Save Lives
ライセンス
MIT
サイズ
48 × 48
カテゴリ
記号
タグ
heartoutline、heart2x outline
SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48"><path fill="currentColor" fill-rule="evenodd" d="M10.345 11.988C8.885 13.846 8 16.384 8 19.035c0 5.94 3.965 10.927 8.15 14.516a43.8 43.8 0 0 0 7.837 5.32l.252-.14a47 47 0 0 0 7.603-5.371C36.044 29.691 40 24.705 40 19.034c0-2.65-.885-5.189-2.344-7.047C36.2 10.137 34.213 9 31.969 9c-3.103 0-5.51 2.02-7.071 5.202L24 16.03l-.898-1.828C21.541 11.02 19.134 9 16.032 9c-2.245 0-4.232 1.136-5.687 2.988M24 40l-.434.9l-.005-.002l-.011-.005l-.041-.02l-.152-.076c-.13-.066-.32-.164-.56-.292a46 46 0 0 1-7.949-5.436C10.535 31.371 6 25.875 6 19.035c0-3.076 1.021-6.055 2.772-8.283C10.528 8.518 13.056 7 16.032 7c3.503 0 6.167 1.963 7.968 4.734C25.8 8.964 28.465 7 31.969 7c2.975 0 5.504 1.518 7.26 3.753C40.978 12.98 42 15.96 42 19.035c0 6.582-4.544 12.079-8.842 15.831a49 49 0 0 1-8.494 5.914l-.151.08l-.04.022l-.012.005l-.003.002h-.001S24.456 40.89 24 40m0 0l.457.89l-.443.227l-.448-.216z" clip-rule="evenodd"/></svg>

Heart Outline アイコンの使い方

React

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

<Icon icon="healthicons:heart-outline" width="24" />

Vue

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

<template>
  <Icon icon="healthicons:heart-outline" width="24" />
</template>

Svelte

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

<Icon icon="healthicons:heart-outline" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[healthicons--heart-outline]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/healthicons -->
<div class="i-healthicons:heart-outline"></div>

Web コンポーネント

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

<iconify-icon icon="healthicons:heart-outline"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/healthicons/heart-outline.svg" alt="Heart Outline アイコン" width="24" height="24">

Health Icons の関連アイコン

他のアイコンセットの Heart Outline アイコン

Heart Outline アイコン のよくある質問

Heart Outline アイコンは商用利用でも無料ですか?

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

React で Heart Outline アイコンを使うには?

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

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

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

Health Icons をすべて見る →