Book Fill icon

lets-icons:book-fill

The Book Fill icon (lets-icons:book-fill) is a free SVG icon from the Lets Icons set by Leonid Tsvetkov. It is drawn on a 24 × 24 grid. Lets Icons are released under the CC BY 4.0 license, which allows use in personal and commercial projects as long as you credit the author. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.

Icon set: Lets Icons
Author: Leonid Tsvetkov
License: CC-BY-4.0
Size: 24 × 24
Category: Study
Tags: bookfill

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g fill="none"><path fill="currentColor" fill-rule="evenodd" d="M6.5 16H16c1.886 0 2.828 0 3.414-.586S20 13.886 20 12V7c0-1.886 0-2.828-.586-3.414S17.886 3 16 3H8c-1.886 0-2.828 0-3.414.586S4 5.114 4 7v11.5A2.5 2.5 0 0 1 6.5 16M9 6a2 2 0 1 0 0 4h6a2 2 0 1 0 0-4z" clip-rule="evenodd"/><path fill="currentColor" d="m19.414 15.414l-.707-.707zm0-11.828l-.707.707zM9 6V5zm0 4V9zm6 0v1zm0-4V5zm1 9H6.5v2H16zm2.707-.293c-.076.076-.212.17-.646.229c-.462.062-1.09.064-2.061.064v2c.915 0 1.701.002 2.328-.082c.655-.088 1.284-.287 1.793-.797zM19 12c0 .971-.002 1.599-.064 2.061c-.059.434-.153.57-.229.646l1.414 1.414c.51-.51.709-1.138.797-1.793C21.002 13.7 21 12.915 21 12zm0-5v5h2V7zm-.293-2.707c.076.076.17.212.229.646C18.998 5.4 19 6.029 19 7h2c0-.915.002-1.701-.082-2.328c-.088-.655-.287-1.284-.797-1.793zM16 4c.971 0 1.599.002 2.061.064c.434.059.57.153.646.229l1.414-1.414c-.51-.51-1.138-.709-1.793-.797C17.7 1.998 16.915 2 16 2zM8 4h8V2H8zm-2.707.293c.076-.076.212-.17.646-.229C6.4 4.002 7.029 4 8 4V2c-.915 0-1.701-.002-2.328.082c-.655.088-1.284.287-1.793.797zM5 7c0-.971.002-1.599.064-2.061c.059-.434.153-.57.229-.646L3.879 2.879c-.51.51-.709 1.138-.797 1.793C2.998 5.3 3 6.085 3 7zm0 11.5V7H3v11.5zM6.5 15A3.5 3.5 0 0 0 3 18.5h2A1.5 1.5 0 0 1 6.5 17zM8 8a1 1 0 0 1 1-1V5a3 3 0 0 0-3 3zm1 1a1 1 0 0 1-1-1H6a3 3 0 0 0 3 3zm6 0H9v2h6zm1-1a1 1 0 0 1-1 1v2a3 3 0 0 0 3-3zm-1-1a1 1 0 0 1 1 1h2a3 3 0 0 0-3-3zM9 7h6V5H9zm2 13H6.5v2H11zm-8-1.5A3.5 3.5 0 0 0 6.5 22v-2A1.5 1.5 0 0 1 5 18.5z"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M20 21H10"/></g></svg>

How to use the Book Fill icon

React

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

<Icon icon="lets-icons:book-fill" width="24" />

Vue

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

<template>
  <Icon icon="lets-icons:book-fill" width="24" />
</template>

Svelte

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

<Icon icon="lets-icons:book-fill" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[lets-icons--book-fill]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/lets-icons -->
<div class="i-lets-icons:book-fill"></div>

Web component

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

<iconify-icon icon="lets-icons:book-fill"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/lets-icons/book-fill.svg" alt="Book Fill icon" width="24" height="24">

Related icons in Lets Icons

Book Fill icon in other icon sets

Book Fill icon FAQ

Is the Book Fill icon free for commercial use?

Yes. Lets Icons are released under the CC BY 4.0 license, which allows use in personal and commercial projects as long as you credit the author.

How do I use the Book Fill icon in React?

Install @iconify/react and render <Icon icon="lets-icons:book-fill" />, or use “Copy code” on this page to get a standalone React component.

How do I add the Book Fill icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/lets-icons/book-fill.svg" alt="Book Fill icon">, or paste the SVG code inline to style it with CSS.

Browse all Lets Icons →