ICONYZ
日本語
Solar の Cosmetic Outline アイコン

Cosmetic Outline アイコン

solar:cosmetic-outline

Cosmetic Outline アイコン(solar:cosmetic-outline)は、Solar セットの無料 SVG アイコンです(作者: 480 Design)。 24 × 24 のグリッドで描かれています。 Solar icons は CC BY 4.0 ライセンス で公開されています。作者のクレジットを表記すれば、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。

アイコンセット
Solar
作者
480 Design
ライセンス
CC-BY-4.0
サイズ
24 × 24
カテゴリ
UI
タグ
cosmeticoutline
SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"><path d="M7.75 5.61798C7.75 4.31706 6.38095 3.47094 5.21738 4.05273L3.21738 5.05273C2.6245 5.34917 2.25 5.95513 2.25 6.61798V10.2499H2C1.58579 10.2499 1.25 10.5857 1.25 10.9999V16.9999C1.25 19.071 2.92893 20.7499 5 20.7499C7.07107 20.7499 8.75 19.071 8.75 16.9999V10.9999C8.75 10.5857 8.41421 10.2499 8 10.2499H7.75V5.61798ZM2.75 11.7499H7.25V16.9999C7.25 18.2426 6.24264 19.2499 5 19.2499C3.75736 19.2499 2.75 18.2426 2.75 16.9999V11.7499ZM6.25 10.2499V5.61798C6.25 5.43213 6.05442 5.31126 5.8882 5.39437L3.8882 6.39437C3.8035 6.43672 3.75 6.52329 3.75 6.61798V10.2499H6.25Z"/><path d="M16.5 4.24994C13.0482 4.24994 10.25 7.04816 10.25 10.4999C10.25 13.6979 12.6518 16.3349 15.75 16.7054V19.2499H13.5C13.0858 19.2499 12.75 19.5857 12.75 19.9999C12.75 20.4142 13.0858 20.7499 13.5 20.7499H19.5C19.9142 20.7499 20.25 20.4142 20.25 19.9999C20.25 19.5857 19.9142 19.2499 19.5 19.2499H17.25V16.7054C20.3482 16.3349 22.75 13.6979 22.75 10.4999C22.75 7.04816 19.9518 4.24994 16.5 4.24994ZM16.5 15.2499C19.1234 15.2499 21.25 13.1233 21.25 10.4999C21.25 7.87659 19.1234 5.74994 16.5 5.74994C13.8766 5.74994 11.75 7.87659 11.75 10.4999C11.75 13.1233 13.8766 15.2499 16.5 15.2499Z"/></g></svg>

Cosmetic Outline アイコンの使い方

React

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

<Icon icon="solar:cosmetic-outline" width="24" />

Vue

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

<template>
  <Icon icon="solar:cosmetic-outline" width="24" />
</template>

Svelte

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

<Icon icon="solar:cosmetic-outline" width="24" />

Tailwind CSS

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

UnoCSS

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

Web コンポーネント

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

<iconify-icon icon="solar:cosmetic-outline"></iconify-icon>

HTML 画像

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

Solar の関連アイコン

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

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

はい。Solar icons は CC BY 4.0 ライセンス で公開されています。作者のクレジットを表記すれば、個人・商用プロジェクトで利用できます。

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

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

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

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

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