Google Calendar アイコン

Q: Google Calendar アイコンは商用利用でも無料ですか?

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

selfhst:google-calendar

Google Calendar アイコン(selfhst:google-calendar)は、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
タグ: googlecalendar

SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path fill="#fff" d="m390.8 121.2l-121.3-13.5l-148.2 13.5l-13.5 134.7l13.5 134.8L256 407.5l134.8-16.8l13.5-138.1z"/><path fill="#1a73e8" d="M176.6 330.4c-10.1-6.8-17-16.7-20.9-29.9l23.4-9.6c2.1 8.1 5.8 14.3 11.1 18.8c5.3 4.4 11.7 6.6 19.1 6.6c7.6 0 14.2-2.3 19.7-7s8.3-10.6 8.3-17.8q0-10.95-8.7-18c-5.8-4.6-13.1-7-21.8-7h-13.5v-23.1h12.1c7.5 0 13.8-2 18.9-6.1c5.1-4 7.7-9.6 7.7-16.6q0-9.45-6.9-15c-4.6-3.7-10.4-5.6-17.4-5.6c-6.9 0-12.3 1.8-16.4 5.5c-4 3.7-7 8.2-8.8 13.5l-23.1-9.6c3.1-8.7 8.7-16.4 16.9-23c8.3-6.6 18.8-10 31.6-10c9.5 0 18 1.8 25.5 5.5s13.5 8.8 17.8 15.2c4.3 6.5 6.4 13.8 6.4 21.9c0 8.3-2 15.2-6 21q-6 8.55-14.7 13.2v1.4c7.6 3.2 13.9 8.1 18.8 14.7s7.3 14.4 7.3 23.6s-2.3 17.3-7 24.5c-4.6 7.2-11.1 12.8-19.2 16.9c-8.2 4.1-17.4 6.2-27.6 6.2c-11.6-.1-22.6-3.5-32.6-10.2m143.4-116L294.5 233l-12.8-19.5l46-33.2h17.7V337h-25.3V214.4z"/><path fill="#ea4335" d="M390.8 512L512 390.8H390.8z"/><path fill="#4285f4" d="M390.8 0H40.5C18 0 0 18 0 40.5v350.3h121.2V121.2h269.6z"/><path fill="#34a853" d="M121.2 390.8V512h269.6V390.8z"/><path fill="#188038" d="M0 390.8v80.8C0 493.9 18.1 512 40.4 512h80.8V390.8z"/><path fill="#fbbc04" d="M512 121.2v.1H390.8v269.5H512z"/><path fill="#1967d2" d="M512 121.2V40.5C512 18.2 493.9 0 471.6 0h-80.8v121.3H512z"/></svg>

Google Calendar アイコンの使い方

React

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

<Icon icon="selfhst:google-calendar" width="24" />

Vue

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

<template>
  <Icon icon="selfhst:google-calendar" width="24" />
</template>

Svelte

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

<Icon icon="selfhst:google-calendar" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[selfhst--google-calendar]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/selfhst -->
<div class="i-selfhst:google-calendar"></div>

Web コンポーネント

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

<iconify-icon icon="selfhst:google-calendar"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/selfhst/google-calendar.svg" alt="Google Calendar アイコン" width="24" height="24">

selfh.st/icons の関連アイコン

他のアイコンセットの Google Calendar アイコン

Google Calendar アイコンのよくある質問

Google Calendar アイコンは商用利用でも無料ですか?

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

React で Google Calendar アイコンを使うには?

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

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

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

selfh.st/icons をすべて見る →