File Type Marko アイコン

Q: File Type Marko アイコンは商用利用でも無料ですか?

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

vscode-icons:file-type-marko

File Type Marko アイコン(vscode-icons:file-type-marko)は、VSCode Icons セットの無料 SVG アイコンです（作者: Roberto Huertas）。 32 × 32 のグリッドで描かれています。 VSCode Icons は MIT ライセンスで公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。

アイコンセット: VSCode Icons
作者: Roberto Huertas
ライセンス: MIT
サイズ: 32 × 32
タグ: filetype、typemarko、filetypemarko

SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><defs><linearGradient id="SVGGp101RZD" x1="14.834" x2="14.834" y1="16.002" y2="11.058" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#8ac23e"/><stop offset="1" stop-color="#8ac23e" stop-opacity="0"/></linearGradient><linearGradient id="SVGHgVmtcsE" x1="16.475" x2="16.475" y1="8.375" y2="13.319" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#698932"/><stop offset="1" stop-color="#698932" stop-opacity="0"/></linearGradient><linearGradient id="SVGHXvOKbaO" x1="19.504" x2="19.504" y1="8.375" y2="13.319" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ffed01"/><stop offset="1" stop-color="#ffed01" stop-opacity="0"/></linearGradient><linearGradient id="SVGKhK2dekR" x1="24.861" x2="24.861" y1="8.375" y2="13.32" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#e02a89"/><stop offset="1" stop-color="#e02a89" stop-opacity="0"/></linearGradient><linearGradient id="SVGiEsVge6f" x1="26.508" x2="26.508" y1="16.002" y2="20.945" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#7f1e4f"/><stop offset="1" stop-color="#7f1e4f" stop-opacity="0"/></linearGradient><linearGradient id="SVGLtWSqbGi" x1="21.149" x2="21.149" y1="16.002" y2="20.945" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#e95506"/><stop offset="1" stop-color="#e95506" stop-opacity="0"/></linearGradient><linearGradient id="SVGz5dVCmNs" x1="5.487" x2="5.487" y1="16.002" y2="11.061" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#88d0f1"/><stop offset="1" stop-color="#88d0f1" stop-opacity="0"/></linearGradient><linearGradient id="SVGgQafgW0G" x1="-357.383" x2="-357.383" y1="-453.915" y2="-458.855" gradientTransform="matrix(-1 0 0 -1 -350.252 -445.54)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#00828b"/><stop offset=".833" stop-color="#00828b" stop-opacity="0"/></linearGradient><linearGradient id="SVG4SMate4C" x1="7.13" x2="7.13" y1="23.628" y2="18.689" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#2073ba"/><stop offset="1" stop-color="#2073ba" stop-opacity="0"/></linearGradient><linearGradient id="SVGJEiuBcMd" x1="10.161" x2="10.161" y1="8.375" y2="13.315" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#8ed0e1"/><stop offset="1" stop-color="#88d0f1" stop-opacity="0"/></linearGradient></defs><path fill="#8dc220" fill-rule="evenodd" d="M16.014 8.375h3.948c-1.455 2.38-3.062 5-4.668 7.627h-3.951c1.607-2.622 3.213-5.247 4.671-7.627"/><path fill="#44bfef" fill-rule="evenodd" d="M6.67 8.375h3.951q-1.172 1.91-2.338 3.816T5.948 16l2.332 3.817q1.164 1.906 2.338 3.81h-3.95q-1.172-1.9-2.338-3.81T2 16l2.332-3.81Q5.5 10.28 6.67 8.375"/><path fill="#00ac71" fill-rule="evenodd" d="M6.669 8.372C8.278 11 9.888 13.622 11.344 16h3.951l-4.674-7.625Z"/><path fill="#f9bc00" fill-rule="evenodd" d="M19.962 8.375h-3.948l2.335 3.816q1.167 1.906 2.338 3.809q-1.172 1.911-2.338 3.817l-2.335 3.81h3.951q1.168-1.9 2.335-3.81T24.638 16c-.784-1.269-1.559-2.538-2.338-3.81s-1.56-2.54-2.338-3.815"/><path fill="url(#SVGGp101RZD)" fill-rule="evenodd" d="M18.326 11.058h-3.954l-1.512 2.471Q12.1 14.765 11.343 16h3.951l1.52-2.474q.76-1.236 1.512-2.468"/><path fill="url(#SVGHgVmtcsE)" fill-rule="evenodd" d="M12.987 13.319h3.951l1.512-2.471l1.512-2.473h-3.948q-.76 1.238-1.515 2.473Z"/><path fill="url(#SVGHXvOKbaO)" fill-rule="evenodd" d="M22.994 13.319h-3.95l-1.518-2.471l-1.512-2.473h3.948q.756 1.238 1.515 2.473c.505.822 1.011 1.652 1.517 2.471"/><path fill="#df1b1c" fill-rule="evenodd" d="M25.321 8.375H21.37l2.332 3.816q1.164 1.903 2.342 3.809q-1.172 1.911-2.338 3.817t-2.335 3.81h3.951q1.168-1.9 2.335-3.81T29.994 16l-2.338-3.81q-1.168-1.902-2.335-3.815"/><path fill="url(#SVGKhK2dekR)" fill-rule="evenodd" d="M28.351 13.32H24.4q-.764-1.233-1.518-2.471T21.37 8.375h3.951l1.512 2.474q.756 1.236 1.518 2.471"/><path fill="url(#SVGiEsVge6f)" fill-rule="evenodd" d="M23.017 20.945h3.951q.756-1.233 1.512-2.47T30 16h-3.956q-.76 1.238-1.515 2.473Z"/><path fill="url(#SVGLtWSqbGi)" fill-rule="evenodd" d="M17.66 20.945h3.951l1.512-2.471l1.515-2.473h-3.951q-.76 1.238-1.515 2.473Z"/><path fill="url(#SVGz5dVCmNs)" fill-rule="evenodd" d="M8.975 11.063H5.024q-.76 1.237-1.515 2.473C2.754 14.772 2.5 15.181 2 16h3.948c.5-.821 1.008-1.646 1.512-2.468s1.008-1.646 1.515-2.469"/><path fill="url(#SVGgQafgW0G)" fill-rule="evenodd" d="M3.644 13.314h3.95q.76-1.237 1.515-2.473c.755-1.236 1.008-1.641 1.51-2.466H6.67c-.5.821-1.008 1.646-1.512 2.468s-1.007 1.647-1.514 2.471"/><path fill="url(#SVG4SMate4C)" fill-rule="evenodd" d="M3.641 18.691h3.951c.5.825 1.008 1.649 1.512 2.471s1.008 1.647 1.515 2.468H6.668q-.761-1.23-1.518-2.468c-.505-.822-1.005-1.648-1.509-2.471"/><path fill="url(#SVGJEiuBcMd)" fill-rule="evenodd" d="M13.648 13.314H9.7q-.76-1.237-1.515-2.473C7.43 9.605 7.174 9.2 6.673 8.375h3.948c.5.821 1.008 1.646 1.512 2.468s1.008 1.647 1.515 2.471"/></svg>

File Type Marko アイコンの使い方

React

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

<Icon icon="vscode-icons:file-type-marko" width="24" />

Vue

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

<template>
  <Icon icon="vscode-icons:file-type-marko" width="24" />
</template>

Svelte

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

<Icon icon="vscode-icons:file-type-marko" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[vscode-icons--file-type-marko]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/vscode-icons -->
<div class="i-vscode-icons:file-type-marko"></div>

Web コンポーネント

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

<iconify-icon icon="vscode-icons:file-type-marko"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/vscode-icons/file-type-marko.svg" alt="File Type Marko アイコン" width="24" height="24">

VSCode Icons の関連アイコン

File Type Marko アイコンのよくある質問

File Type Marko アイコンは商用利用でも無料ですか?

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

React で File Type Marko アイコンを使うには?

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

File Type Marko アイコンをウェブページに追加するには?

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

VSCode Icons をすべて見る →