Add icons to this collection by clicking the heart icon.
Notes icon - also known as education, write, notebook, notes, plan, and notepad. Created in a clean gradient style, perfect for web, apps, and UI projects. Available in SVG and PNG, with multiple style variants.
<svg
xmlns="http://www.w3.org/2000/svg"
width="512"
height="512"
viewBox="0 0 64 64"
>
<linearGradient
id="a"
x1="22.74"
x2="72.08"
y1="-7.12"
y2="47.22"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#15b3ff" />
<stop offset="1" stop-color="#e200e9" />
</linearGradient>
<linearGradient
id="b"
x1="16.07"
x2="65.4"
y1="-1.06"
y2="53.28"
href="#a"
/>
<linearGradient
id="c"
x1="11.59"
x2="60.92"
y1="3.01"
y2="57.34"
href="#a"
/>
<linearGradient
id="d"
x1="7.11"
x2="56.45"
y1="7.08"
y2="61.41"
href="#a"
/>
<linearGradient
id="e"
x1="13.52"
x2="62.86"
y1="1.25"
y2="55.59"
href="#a"
/>
<linearGradient
id="f"
x1=".98"
x2="50.32"
y1="12.64"
y2="66.98"
href="#a"
/>
<linearGradient
id="g"
x1="-2.61"
x2="46.72"
y1="15.91"
y2="70.24"
href="#a"
/>
<linearGradient
id="h"
x1="2.36"
x2="51.7"
y1="11.39"
y2="65.72"
href="#a"
/>
<linearGradient id="i" x1="7.34" x2="56.67" y1="6.87" y2="61.2" href="#a" />
<linearGradient
id="j"
x1="-7.59"
x2="41.74"
y1="20.42"
y2="74.76"
href="#a"
/>
<linearGradient
id="k"
x1="-12.57"
x2="36.77"
y1="24.94"
y2="79.28"
href="#a"
/>
<path
fill="url(#a)"
d="M54 21.5H38a1 1 0 0 1-1-1v-4a1 1 0 0 1 1-1h16a1 1 0 0 1 1 1v4a1 1 0 0 1-1 1zm-15-2h14v-2H39z"
/>
<path
fill="url(#b)"
d="M54 30.5H30a1 1 0 0 1-1-1v-4a1 1 0 0 1 1-1h24a1 1 0 0 1 1 1v4a1 1 0 0 1-1 1zm-23-2h22v-2H31z"
/>
<path
fill="url(#c)"
d="M54 39.5H30a1 1 0 0 1-1-1v-4a1 1 0 0 1 1-1h24a1 1 0 0 1 1 1v4a1 1 0 0 1-1 1zm-23-2h22v-2H31z"
/>
<path
fill="url(#d)"
d="M54 48.5H30a1 1 0 0 1-1-1v-4a1 1 0 0 1 1-1h24a1 1 0 0 1 1 1v4a1 1 0 0 1-1 1zm-23-2h22v-2H31z"
/>
<path
fill="url(#e)"
d="M58 61H24a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h34a3 3 0 0 1 3 3v52a3 3 0 0 1-3 3zm-33-2h33a1 1 0 0 0 1-1V6a1 1 0 0 0-1-1H25z"
/>
<path
fill="url(#f)"
d="M24 61H14a3 3 0 0 1-3-3v-3a1 1 0 0 1 1-1h1.83A2.12 2.12 0 0 0 16 52.15 2 2 0 0 0 14 50h-2a1 1 0 0 1-1-1v-4a1 1 0 0 1 1-1h1.83A2.12 2.12 0 0 0 16 42.15 2 2 0 0 0 14 40h-2a1 1 0 0 1-1-1v-4a1 1 0 0 1 1-1h2a2 2 0 0 0 2-2.15A2.12 2.12 0 0 0 13.83 30H12a1 1 0 0 1-1-1v-4a1 1 0 0 1 1-1h2a2 2 0 0 0 2-2.15A2.12 2.12 0 0 0 13.83 20H12a1 1 0 0 1-1-1v-4a1 1 0 0 1 1-1h2a2 2 0 0 0 2-2.15A2.12 2.12 0 0 0 13.83 10H12a1 1 0 0 1-1-1V6a3 3 0 0 1 3-3h10a1 1 0 0 1 1 1v56a1 1 0 0 1-1 1zm-11-5v2a1 1 0 0 0 1 1h9V5h-9a1 1 0 0 0-1 1v2h.83A4.11 4.11 0 0 1 18 11.71 4 4 0 0 1 14 16h-1v2h.83A4.11 4.11 0 0 1 18 21.71 4 4 0 0 1 14 26h-1v2h.83A4.11 4.11 0 0 1 18 31.71 4 4 0 0 1 14 36h-1v2h1a4 4 0 0 1 4 4.29A4.11 4.11 0 0 1 13.83 46H13v2h1a4 4 0 0 1 4 4.29A4.11 4.11 0 0 1 13.83 56z"
/>
<path
fill="url(#g)"
d="M14 36h-4a4 4 0 1 1 0-8h4a4 4 0 1 1 0 8zm-4-6a2 2 0 0 0-2 2 2 2 0 0 0 2 2h4a2 2 0 0 0 2-2 2 2 0 0 0-2-2z"
/>
<path
fill="url(#h)"
d="M14 26h-4a4 4 0 1 1 0-8h4a4 4 0 1 1 0 8zm-4-6a2 2 0 0 0-2 2 2 2 0 0 0 2 2h4a2 2 0 0 0 2-2 2 2 0 0 0-2-2z"
/>
<path
fill="url(#i)"
d="M14 16h-4a4 4 0 1 1 0-8h4a4 4 0 1 1 0 8zm-4-6a2 2 0 0 0-2 2 2 2 0 0 0 2 2h4a2 2 0 0 0 2-2 2 2 0 0 0-2-2z"
/>
<path
fill="url(#j)"
d="M14 46h-4a4 4 0 0 1 0-8h4a4 4 0 0 1 0 8zm-4-6a2 2 0 0 0-2 2 2 2 0 0 0 2 2h4a2 2 0 0 0 2-2 2 2 0 0 0-2-2z"
/>
<path
fill="url(#k)"
d="M14 56h-4a4 4 0 0 1 0-8h4a4 4 0 0 1 0 8zm-4-6a2 2 0 0 0-2 2 2 2 0 0 0 2 2h4a2 2 0 0 0 2-2 2 2 0 0 0-2-2z"
/>
</svg>
More icons in the same style and category