Sleep icon
whh:sleep
The Sleep icon (whh:sleep) is a free SVG icon from the WebHostingHub Glyphs set by WebHostingHub. It is drawn on a 1024 × 1024 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 × 1024
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="1024" height="1024" viewBox="0 0 1024 1024"><path fill="currentColor" d="M734 448h258q13 0 22.5 9.5t9.5 22.5t-9.5 22.5T992 512H672q-13 0-22.5-9.5T640 480q0-14 10-23L930 64H672q-13 0-22.5-9.5T640 32t9.5-22.5T672 0h320q12 0 22 11.5t10 20.5t-8 21zM576 800q0 13-9.5 22.5T544 832H288q-13 0-22.5-9.5T256 800q0-14 10-23l216-265H288q-13 0-22.5-9.5T256 480t9.5-22.5T288 448h256q12 0 22 11.5t10 20.5t-8 21L350 768h194q13 0 22.5 9.5T576 800M192 992q0 13-9.5 22.5T160 1024H32q-13 0-22.5-9.5T0 992q0-14 10-23l88-137H32q-13 0-22.5-9.5T0 800t9.5-22.5T32 768h128q12 0 22 11.5t10 20.5t-8 21L94 960h66q13 0 22.5 9.5T192 992"/></svg>
How to use the Sleep icon
React
import { Icon } from "@iconify/react";
<Icon icon="whh:sleep" width="24" />
Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="whh:sleep" width="24" />
</template>
Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="whh:sleep" width="24" />
Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[whh--sleep]"></span>
UnoCSS
<!-- @unocss/preset-icons + @iconify-json/whh -->
<div class="i-whh:sleep"></div>
Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="whh:sleep"></iconify-icon>
HTML image
<img src="https://iconyz.com/api/public/svg/whh/sleep.svg" alt="Sleep icon" width="24" height="24">
Sleep icon in other icon sets
Sleep icon FAQ
Is the Sleep 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 Sleep icon in React?
Install @iconify/react and render <Icon icon="whh:sleep" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Sleep icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/whh/sleep.svg" alt="Sleep icon">, or paste the SVG code inline to style it with CSS.
Browse all WebHostingHub Glyphs icons →
ICONYZ
