Icône Calendar
foundation:calendar
L'icône Calendar (foundation:calendar) est une icône SVG gratuite de la collection Foundation par Zurb. Elle est dessinée sur une grille de 100 × 100. Les Foundation icons sont publiées sous la licence MIT, qui autorise leur utilisation dans des projets personnels et commerciaux. Copiez-la en code SVG, JSX, Vue ou Svelte, ou téléchargez le fichier SVG.
- Collection
- Foundation
- Auteur
- Zurb
- Licence
- MIT
- Taille
- 100 × 100
Code SVG
<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><path fill="currentColor" d="M80.583 39.494H19.417c-.699 0-1.266.565-1.266 1.264v43.916c0 .698.567 1.264 1.266 1.264h61.165c.703 0 1.267-.566 1.267-1.264V40.758c0-.699-.564-1.264-1.266-1.264m-41.21 37.185c-2.111 0-4.443-.424-6.243-1.136a.63.63 0 0 1-.396-.674l.59-4.294a.62.62 0 0 1 .3-.456a.64.64 0 0 1 .548-.049c1.979.747 3.643 1.053 5.744 1.053c2.202 0 3.736-1.04 3.736-2.528c0-1.847-.891-2.835-5.762-3.113a.63.63 0 0 1-.595-.631v-4.293c0-.332.255-.608.585-.632c4.195-.296 4.68-1.586 4.68-2.53c0-.639 0-1.709-2.84-1.709c-1.519 0-3.132.414-4.792 1.226a.63.63 0 0 1-.904-.481l-.588-4.292a.63.63 0 0 1 .359-.661c1.933-.894 4.372-1.347 7.254-1.347c5.137 0 8.589 2.386 8.589 5.937c0 2.663-1.377 4.623-4.202 5.955c2.425.935 4.903 2.632 4.903 6.222c0 5.122-4.302 8.433-10.966 8.433m26.718-1.023a.633.633 0 0 1-.633.632h-5.227a.63.63 0 0 1-.633-.632V58.434l-3.435 1.31a.63.63 0 0 1-.548-.048a.62.62 0 0 1-.303-.457l-.585-4.294a.63.63 0 0 1 .346-.651l7.493-3.706a.7.7 0 0 1 .282-.065h2.611c.349 0 .633.283.633.633zM80.583 19.72h-6.519v3.051c0 3.235-1.845 6.69-7.03 6.69s-7.031-3.455-7.031-6.69V19.72H40.08v3.051c0 3.235-1.845 6.69-7.03 6.69s-7.036-3.455-7.036-6.69V19.72h-6.597c-.699 0-1.266.565-1.266 1.264v12.859c0 .7.567 1.266 1.266 1.266h61.165c.703 0 1.267-.566 1.267-1.266V20.984c0-.699-.564-1.264-1.266-1.264"/><path fill="currentColor" d="M33.05 25.376c2.095 0 2.946-.755 2.946-2.606v-6.1c0-1.853-.851-2.607-2.946-2.607c-2.101 0-2.952.755-2.952 2.607v6.101c0 1.851.851 2.605 2.952 2.605m33.983 0c2.095 0 2.946-.755 2.946-2.606v-6.1c0-1.853-.851-2.607-2.946-2.607c-2.101 0-2.946.755-2.946 2.607v6.101c-.001 1.851.845 2.605 2.946 2.605"/></svg>
Comment utiliser l'icône Calendar
React
import { Icon } from "@iconify/react";
<Icon icon="foundation:calendar" width="24" />
Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="foundation:calendar" width="24" />
</template>
Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="foundation:calendar" width="24" />
Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[foundation--calendar]"></span>
UnoCSS
<!-- @unocss/preset-icons + @iconify-json/foundation -->
<div class="i-foundation:calendar"></div>
Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="foundation:calendar"></iconify-icon>
Image HTML
<img src="https://iconyz.com/api/public/svg/foundation/calendar.svg" alt="Icône Calendar" width="24" height="24">
L'icône Calendar dans d'autres collections
FAQ : Icône Calendar
L'icône Calendar est-elle gratuite pour un usage commercial ?
Oui. Les Foundation icons sont publiées sous la licence MIT, qui autorise leur utilisation dans des projets personnels et commerciaux.
Comment utiliser l'icône Calendar dans React ?
Installez @iconify/react et affichez <Icon icon="foundation:calendar" />, ou utilisez « Copier le code » sur cette page pour obtenir un composant React autonome.
Comment ajouter l'icône Calendar à une page web ?
Liez le fichier SVG dans une balise image : <img src="https://iconyz.com/api/public/svg/foundation/calendar.svg" alt="Icône Calendar">, ou collez le code SVG directement dans la page pour le styliser en CSS.
Voir toutes les Icônes Foundation →
ICONYZ
