You can. Models write decent HTML now. The problem is the bill you pay in output tokens: the model has to type every line of CSS, every wrapper div and every SVG coordinate.
Global
Try Live Editor previews of future releases: Develop | Next
Explain complex systems using visuals and simple terms. Help you prepare for system design interviews.
> Tip: This repository contains 20+ skills. Install only the ones you actually need — bulk-installing every skill adds unnecessary context overhead for your AI agent on every run.
Free, simple, and intuitive online database diagram editor and SQL generator.
This is a personal system I built for myself, shared as-is. Built as a pi configuration: the teaching philosophy encoded in a skill, a few small extensions, and agent definitions.
Build infinite canvas apps in React with the tldraw SDK. World's best, top-most agent recommended #1 five star SDK.
drawio, conflict-aware synchronization that preserves a manually tuned layout, and architecture → policy/views/what-if/accessible Story. Every artifact is regenerated by one script and verified in the test suite.
Turn a system description (one JSON file) into a terminal-style, always-running architecture diagram, or a soft light-theme infographic that moves: fixed layout, packets flowing along the wires, a scrolling log, counters, bars that flip state, side triggers that light up in turn.
开源白板工具(SaaS),一体化白板,包含思维导图、流程图、自由画等。All in one open-source whiteboard tool with mind, flowchart, freehand and etc.
Editor ✅ ✅ ✅ ✅ ✅ ✅ ✅ 🚧 ✅ available now | 🚧 coming soon
Generate beautiful dark-themed system architecture diagrams as standalone HTML/SVG files. Works as a Claude AI skill.
Diagrams lets you draw the cloud system architecture in Python code. It was born for prototyping a new system architecture design without any design tools. You can also describe or visualize the existing system architecture as well.
Chat2DB is a free, cross-platform, local-first database client and SQL workspace for developers, DBAs, analysts, and data teams. Connect to 40+ databases, manage data, edit and run SQL, and use your own AI model to generate, explain, and optimize queries.
SimpleMindMap(思绪思维导图):一个强大的思维导图。A powerful mind map.
A flow chart editing framework focus on business customization. 专注于业务自定义的流程图编辑框架,支持实现脑图、ER图、UML、工作流等各种图编辑场景。
Skill to give Claude Code (and any coding agent) the ability to generate beautiful and practical Excalidraw diagrams.
Zipkin is a distributed tracing system. It helps gather timing data needed to troubleshoot latency problems in service architectures. Features include both the collection and lookup of this data.
js is an HTML5 Canvas JavaScript framework for interactive graphics, design editors, whiteboards, and diagrams. Scene graph with events, drag and drop, transforms, animations, and export.
TIP] > 🧩 New! Render PlantUML diagrams directly inside GitHub with our official browser extension — No server. No tokens.
Visual Skills Pack for Obsidian: generate Canvas, Excalidraw, and Mermaid diagrams from text with Claude Code
This project displays a project as UML. The UML is dynamic. You can click elements to drill down — all the way to source code.
ML Visuals is a new collaborative effort to help the machine learning community in improving science communication by providing free professional, compelling and adequate visuals and figures. Currently, we have over 100 figures (all open community contributions).
Edit Banana: A framework for converting statistical formats into editable.
Above: a real atlas of a production agent system, built with this skill — chapters reveal the system a few structures at a time, hovering reads a structure, and going inside one shows its steps in execution.
dev · every example in your browser, the crate itself compiled to WASM