Preview icon
whh:preview
The Preview icon (whh:preview) is a free SVG icon from the WebHostingHub Glyphs set by WebHostingHub. It is drawn on a 1024 × 1025 grid. WebHostingHub Glyphs icons are released under the Open Font 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
- WebHostingHub Glyphs
- Author
- WebHostingHub
- License
- OFL-1.1
- Size
- 1024 × 1025
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="1024" height="1025" viewBox="0 0 1024 1025"><path fill="currentColor" d="M960 1025H256q-27 0-45.5-18.5T192 961v-81q-85-31-138.5-105T0 608t53.5-167T192 337V65q0-26 18.5-45T256 1h384v352q0 13 9.5 22.5T672 385h351l1 1v575q0 26-19 45t-45 19M632 870L481 720q31-53 31-112q0-92-65.5-158T288 384t-158.5 65.5T64 608t65.5 158.5T288 832q58 0 112-31l150 151q8 8 20 8t21-8l41-41q8-8 8-20t-8-21M288 768q-66 0-113-46.5t-47-113T175 495t113-47t113 47t47 113.5t-47 113T288 768M704 0q26 1 44 19l257 257q19 19 18 45H704z"/></svg>
How to use the Preview icon
React
import { Icon } from "@iconify/react";
<Icon icon="whh:preview" width="24" />
Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="whh:preview" width="24" />
</template>
Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="whh:preview" width="24" />
Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[whh--preview]"></span>
UnoCSS
<!-- @unocss/preset-icons + @iconify-json/whh -->
<div class="i-whh:preview"></div>
Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="whh:preview"></iconify-icon>
HTML image
<img src="https://iconyz.com/api/public/svg/whh/preview.svg" alt="Preview icon" width="24" height="24">
Preview icon in other icon sets
Preview icon FAQ
Is the Preview icon free for commercial use?
Yes. WebHostingHub Glyphs icons are released under the Open Font License, which allows use in personal and commercial projects.
How do I use the Preview icon in React?
Install @iconify/react and render <Icon icon="whh:preview" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Preview icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/whh/preview.svg" alt="Preview icon">, or paste the SVG code inline to style it with CSS.
Browse all WebHostingHub Glyphs icons →
ICONYZ
