Home/Libraries/Freehand free icons (Iconify)/learning-programming-book

Freehand free icons (Iconify)

LearningProgrammingBook

License: CC-BY-4.0

ICON SIZE

COLOR PICKER

Download SVG without fill color (CSS-styleable)

<svg style="color: #818cf8" xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 24 24"><g fill="#818cf8" fill-rule="evenodd" clip-rule="evenodd"><path d="M21.8 10.12c-.28.3-1.778 1.999-1.998 2.298c-.22.3-.52.64-.769 1a50 50 0 0 0-1.659 2.377a.34.34 0 0 0 .07.49a.35.35 0 0 0 .49-.06c.65-.74 1.349-1.429 1.998-2.158c.44-.49 1.998-2.358 2.418-2.858s.11-1.798-.55-1.089"/><path d="M23.699 7.283a.35.35 0 0 0-.35-.31a.34.34 0 0 0-.35.35c0 .64.07 3.217.05 3.546c-.02.463-.103.92-.25 1.36a1.9 1.9 0 0 1-.319.539c-.24.3-.53.58-.78.84l-2.137 2.357c-1 1.11-1.839 2.358-2.818 3.477c-.23.25-.49.47-.74.71a15 15 0 0 0 .08-1.62v-.769c0-.25-.07-.509-.12-.749c-.1-.49-.249-.949-.379-1.429c.95-1.169 1.948-2.288 2.907-3.447c.61-.719 1.18-1.458 1.769-2.188c.88-1.099 1.738-2.218 2.638-3.307c.51-.57.31-.74.2-.82a5.6 5.6 0 0 0-1.39-.848a14.5 14.5 0 0 0-2.187-.74l-5.206-1.259a12.4 12.4 0 0 0-2.308-.34a4.4 4.4 0 0 0-1.728.25q-.542.249-1 .63c-.469.34-.859.74-1.268 1.059c-.61.55-1.2 1.13-1.749 1.729c-.829.889-1.608 1.818-2.398 2.757c-.64.75-1.348 1.429-1.938 2.198a8 8 0 0 0-.71 1.1a.26.26 0 0 0 0 .15q-.24.197-.409.459a4.3 4.3 0 0 0-.56 1.269a4.63 4.63 0 0 0 0 2.997a5.1 5.1 0 0 0 1.799 2.328c.72.5 1.537.84 2.398 1c1.2.189 2.413.276 3.627.259c1.059 0 2.408.1 3.776.2c1.37.1 2.698.22 3.757.35c0 0 1.389-1.12 1.659-1.38c1.059-.999 1.998-2.188 3.067-3.197c.32-.3.63-.61.92-.929c.439-.47.848-.999 1.278-1.439a10 10 0 0 0 .82-.999q.276-.411.439-.879c.15-.55.221-1.118.21-1.688c0-1.21-.26-2.518-.3-3.577M2.767 11.389c.56-.6 1.2-1.159 1.769-1.768a100 100 0 0 1 2.528-2.578c.559-.55 1.139-1.07 1.758-1.589c.36-.31.73-.69 1.139-.999q.34-.285.74-.48a3.3 3.3 0 0 1 1.238-.17q1.08.034 2.138.25l5.246 1q1.067.22 2.088.6q.474.21.91.499c-1 .999-1.95 1.928-2.878 2.947c-.39.44-.78.89-1.16 1.349c-.379.46-.749.93-1.088 1.409c-2.798 3.886-1 3.357-4.277 2.657c-2.637-.55-5.215-1.548-7.903-1.958c-.65-.09-1.428-.34-2.168-.4a3.6 3.6 0 0 0-.74.06q.309-.431.66-.829m9.172 8.752a91 91 0 0 0-3.786-.34a21.5 21.5 0 0 1-3.447-.359a4.9 4.9 0 0 1-1.929-.86a3.86 3.86 0 0 1-1.388-1.798a3.53 3.53 0 0 1 0-2.228q.116-.421.32-.809a.74.74 0 0 1 .389-.39c.33-.066.67-.066.999 0c.64.07 1.289.23 1.828.29c2.668.27 5.256 1.13 7.894 1.579q.99.183 1.998.25q-.06.964 0 1.928q.067.57.19 1.129c.42 2.687 1.149 2.058-3.068 1.608"/><path d="M13.248 16.315a31 31 0 0 0-3.377-1a15 15 0 0 0-3.007-.349a23 23 0 0 0-3.527.14a.35.35 0 1 0 0 .7q1.468.026 2.927.2c.9.089 1.809.239 2.708.349c1.389.18 2.758.32 4.086.58a.29.29 0 0 0 .37-.22a.31.31 0 0 0-.18-.4m-.19 2.178a30 30 0 0 0-3.187-.88c-.46-.09-.93-.16-1.399-.22c-.47-.06-.939-.09-1.418-.1a30 30 0 0 0-3.308.05a.34.34 0 0 0-.34.35a.35.35 0 0 0 .34.35c.61 0 1.22.1 1.849.17c.63.07 1.209.17 1.828.24l1.819.23c1.258.13 2.487.22 3.676.41a.31.31 0 0 0 .38-.22a.33.33 0 0 0-.24-.38M9.302 7.742q.31.328.58.69q.178.232.319.49a.349.349 0 0 0 .646-.003a.36.36 0 0 0 .003-.268a5.4 5.4 0 0 0-.31-.789c-.12-.25-.25-.48-.38-.73l.79-.239q.285-.09.58-.15q.291-.058.59-.07a.311.311 0 0 0 .05-.62a5 5 0 0 0-.69-.08h-.69l-1.109.11l-.33.05h-.16c-.509.07-.519.65-.519.66c.023.172.084.336.18.48c.16.15.33.32.45.47m5.924-.38a.3.3 0 0 0 0 .43q.33.346.6.739q.195.294.34.619h-.06q-.36.055-.71.16c-.49.15-.999.36-1.448.47a.35.35 0 0 0-.168.622a.36.36 0 0 0 .257.077l2.149-.19q.367.016.729-.05a1 1 0 0 0 .55-.32a.66.66 0 0 0 .13-.54a3.4 3.4 0 0 0-.31-.609a5 5 0 0 0-.6-.679a7 7 0 0 0-.999-.78a.31.31 0 0 0-.46.05M10.52 10.12a.36.36 0 0 0 .112.577a.34.34 0 0 0 .378-.077l1.998-1.439c.34-.31.69-.61 1-.94c.47-.489.879-.998 1.358-1.528a.31.31 0 1 0-.36-.46q-.891.537-1.718 1.17c-.36.28-.68.599-.999.889z"/></g></svg>

Icons in Action

WEB APPLICATION HEADER & NAVIGATION

my-app.com/dashboard

Overview Dashboard

PROGRESS STEPPER

BUTTON UI ACTIONS

SCALABILITY & CLARITY

12px

16px

24px

32px

48px

“

Highly adaptable, clean vectors that scale perfectly across modern UI components, navigation bars, and mobile actions. Perfectly pre-vetted for production deployment.

IconSearch Presets

Frequently Asked Questions

Q.How do I use this icon in my React/Next.js project?

You have two choices: install the official package listed under the "REACT IMPORT" tab (e.g. npm install @iconify/react) and import the icon directly, or copy the complete React Component code from the "STANDALONE JSX" tab and paste it directly into a local file (e.g. LearningProgrammingBookIcon.tsx) to avoid installing any npm packages.

Q.Is this icon free for commercial use?

Yes. This icon is published under the open-source **CC-BY-4.0** license. The license grants full permissions for personal and commercial usage (e.g., in SaaS platforms, client projects, or business landing pages). Attributing the icon creator is generally not required for MIT/ISC licenses, but check details on our dedicated License Guide.

Q.What is the "Download SVG without fill color" toggle?

Many SVGs ship with inline fill="..." attributes. By checking this toggle, we strip these attributes and enforce fill="none", making the SVG fully styleable via CSS classes or Tailwind utility classes like fill-current.