OpenCharts Library

Browse, install, and use curated community component libraries to build richer whiteboards faster. Over 10 categories covering architecture, UX, cloud, networking, and more.

What is the Library?

The OpenCharts Library is a curated collection of community-built component packs sourced from the Excalidraw Libraries ecosystem. Each pack contains reusable, drag-and-drop elements — icons, shapes, diagrams, and templates — organized by domain.

10

Categories

25+

Library Packs

100s

Components

Library Categories

Architecture & System Design

Software architecture, system diagrams, and infrastructure components for planning technical systems.

Examples: Microservice boxes, API gateways, load balancers, database symbols

UX & Wireframing

Wireframe elements, buttons, inputs, and mobile/web UI components for mocking up interfaces.

Examples: Form fields, navigation bars, card layouts, mobile frames

Flowchart Symbols

Standard flowchart symbols and shapes — terminals, processes, decisions, and data blocks.

Examples: Start/end ovals, process rectangles, decision diamonds

Cloud & DevOps

AWS, Azure, GCP, and Kubernetes icons for cloud infrastructure and DevOps pipeline diagrams.

Examples: EC2 instances, S3 buckets, Lambda functions, Kubernetes pods

Data & Databases

Database schemas, data flow, and API icons for modeling data architecture.

Examples: Table symbols, ER relationships, data warehouse icons

Networking & Protocols

Network topology, routers, switches, firewalls, and protocol flow elements.

Examples: Router icons, switch symbols, firewall shields, server racks

Presentation & Graphics

Themes, bullet layouts, screen ratios, and decorative elements for slide-like presentations.

Examples: Title slides, bullet templates, section dividers

Icons & Logos

Software logos, brand icons, technology symbols, and general-purpose icons.

Examples: React, Node.js, Docker, GitHub logos and tech brand marks

Math & Science

Mathematical symbols, science diagrams, and educational components for academic content.

Examples: Greek letters, equation blocks, circuit elements, lab equipment

UML & Modeling

UML activity diagrams, class diagrams, sequence diagrams, and modeling elements.

Examples: Class boxes, association arrows, lifelines, swim lanes

How to Use the Library Browser

1

Open the Library Browser

Click the library icon in the whiteboard toolbar. The browser opens as a dialog showing all available community libraries.

2

Search & Filter

Use the search bar to find libraries by name, description, or component name. Use category pills to narrow results by domain (Architecture, UX, Cloud, etc.).

3

Preview & Install

Each library card shows a preview image, author, description, and item count. Click "Add" to install — components are injected into your whiteboard's library panel immediately.

4

Use Components

After installing, the library panel opens on the left. Drag components from the panel onto your canvas. Combine them with freehand drawing and text for rich diagrams.

5

Refresh & Manage

Click the refresh button to reload the latest library catalog from the community repository. Libraries are cached locally for 7 days for fast loading.

Library Persistence & Caching

  • Installed libraries are cached in your browser (localStorage) with a 7-day TTL. Reopening a project reloads your library instantly.
  • Curated libraries auto-load on first use — a small set of popular packs are pre-fetched when you open whiteboard mode.
  • Use the Refresh button in the browser header to clear the cache and fetch the latest catalog and library data.
  • Libraries are deduplicated automatically — installing the same library twice won't create duplicate items.

Best Practices

  • ✓Install only what you need — Adding every library clutters the panel. Start with one or two relevant packs.
  • ✓Combine components with drawing — Start with library assets for structure, then annotate with pen and text tools for context.
  • ✓Use category filters — With 25+ packs, category pills and search make finding the right library much faster than scrolling.
  • ✓Refresh periodically — The community adds new libraries regularly. Hit refresh to discover new packs.

Tip: Recently installed components appear at the top of the library panel, so you can drag them immediately without scrolling.

Drawing Tools & CanvasAI in Whiteboard Mode