Token Date icon
oui:token-date
The Token Date icon (oui:token-date) is a free SVG icon from the OpenSearch UI set by OpenSearch Contributors. It is drawn on a 24 × 24 grid. OpenSearch UI icons are released under the Apache 2.0 license, which allows use in personal and commercial projects. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.
- Icon set
- OpenSearch UI
- Author
- OpenSearch Contributors
- License
- Apache-2.0
- Size
- 24 × 24
- Tags
- tokendate
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M13 11.567C13 12.36 12.36 13 11.567 13H4.433C3.64 13 3 12.36 3 11.567V4.433C3 3.64 3.64 3 4.433 3H6v-.495a.51.51 0 0 1 .412-.497L6.5 2c.276 0 .5.214.5.505V3h2v-.495a.51.51 0 0 1 .412-.497L9.5 2c.276 0 .5.214.5.505V3h1.567C12.36 3 13 3.64 13 4.433zM4 6v5.33c0 .37.3.67.67.67h6.66c.37 0 .67-.3.67-.67V6zm1.5 4c.245 0 .45.183.492.412L6 10.5c0 .245-.183.45-.412.492L5.5 11a.505.505 0 0 1-.5-.5c0-.245.183-.45.412-.492zM8 10c.245 0 .45.183.492.412l.008.088c0 .245-.183.45-.412.492L8 11a.505.505 0 0 1-.5-.5c0-.245.183-.45.412-.492zm2.5 0c.245 0 .45.183.492.412L11 10.5c0 .245-.183.45-.412.492L10.5 11a.505.505 0 0 1-.5-.5c0-.245.183-.45.412-.492zm-5-1.5c.245 0 .45.183.492.412L6 9c0 .245-.183.45-.412.492L5.5 9.5A.505.505 0 0 1 5 9c0-.245.183-.45.412-.492zm2.5 0c.245 0 .45.183.492.412L8.5 9c0 .245-.183.45-.412.492L8 9.5a.505.505 0 0 1-.5-.5c0-.245.183-.45.412-.492zm2.5 0c.245 0 .45.183.492.412L11 9c0 .245-.183.45-.412.492L10.5 9.5A.505.505 0 0 1 10 9c0-.245.183-.45.412-.492zM5.5 7c.245 0 .45.183.492.412L6 7.5c0 .245-.183.45-.412.492L5.5 8a.505.505 0 0 1-.5-.5c0-.245.183-.45.412-.492zM8 7c.245 0 .45.183.492.412L8.5 7.5c0 .245-.183.45-.412.492L8 8a.505.505 0 0 1-.5-.5c0-.245.183-.45.412-.492zm2.5 0c.245 0 .45.183.492.412L11 7.5c0 .245-.183.45-.412.492L10.5 8a.505.505 0 0 1-.5-.5c0-.245.183-.45.412-.492zM4 5h8v-.33c0-.37-.3-.67-.67-.67H4.67C4.3 4 4 4.3 4 4.67z"/></svg>How to use the Token Date icon
React
import { Icon } from "@iconify/react";
<Icon icon="oui:token-date" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="oui:token-date" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="oui:token-date" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[oui--token-date]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/oui -->
<div class="i-oui:token-date"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="oui:token-date"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/oui/token-date.svg" alt="Token Date icon" width="24" height="24">Related icons in OpenSearch UI
Token Date icon FAQ
Is the Token Date icon free for commercial use?
Yes. OpenSearch UI icons are released under the Apache 2.0 license, which allows use in personal and commercial projects.
How do I use the Token Date icon in React?
Install @iconify/react and render <Icon icon="oui:token-date" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Token Date icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/oui/token-date.svg" alt="Token Date icon">, or paste the SVG code inline to style it with CSS.