Color

Advanced editing in SVG Editor

VS Code Codicons

Notebook Icon

Free SVG icon from the VS Code Codicons collection. Download or copy for use in any project.

Download SVG

Collection: VS Code Codicons
Format: SVG, Font (WOFF2), npm, PNG
License: CC BY 4.0 - Free for commercial use
Tags: notebook

The Notebook icon is available as a free SVG and is ready to drop into any web or app project.

img tag

<img src="https://proicons.com/icon/307314.svg" alt="Notebook icon" width="24" height="24">

React JSX

<img src="https://proicons.com/icon/307314.svg" alt="Notebook icon" width={24} height={24} />

Vue template

<img
  src="https://proicons.com/icon/307314.svg"
  alt="Notebook icon"
  :width="24"
  :height="24"
/>

CSS background

.icon-notebook {
  background-image: url('https://proicons.com/icon/307314.svg');
  background-size: contain;
  background-repeat: no-repeat;
  width: 24px;
  height: 24px;
  display: inline-block;
}

SVG markup

<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="currentColor"><path d="M4.75 3C4.33579 3 4 3.33579 4 3.75V5.25C4 5.66421 4.33579 6 4.75 6H10.25C10.6642 6 11 5.66421 11 5.25V3.75C11 3.33579 10.6642 3 10.25 3H4.75ZM5 5V4H10V5H5ZM2 2.75C2 1.7835 2.7835 1 3.75 1H11.25C12.2165 1 13 1.7835 13 2.75V13.25C13 14.2165 12.2165 15 11.25 15H3.75C2.7835 15 2 14.2165 2 13.25V2.75ZM3.75 2C3.33579 2 3 2.33579 3 2.75V13.25C3 13.6642 3.33579 14 3.75 14H11.25C11.6642 14 12 13.6642 12 13.25V2.75C12 2.33579 11.6642 2 11.25 2H3.75ZM14.625 4H14V6H14.625C14.8321 6 15 5.83211 15 5.625V4.375C15 4.16789 14.8321 4 14.625 4ZM14 7H14.625C14.8321 7 15 7.16789 15 7.375V8.625C15 8.83211 14.8321 9 14.625 9H14V7ZM14.625 10H14V12H14.625C14.8321 12 15 11.8321 15 11.625V10.375C15 10.1679 14.8321 10 14.625 10Z"/></svg>

Notebook in other icon packs

Phosphor Icons

Carbon Icons

Hugeicons

Atlas Icons

Element Plus Icons

Simple Line Icons Outline

Copied!

Notebook Icon

More from VS Code Codicons

Notebook in other icon packs