다이어그램, 차트 & 애니메이션 시각화 도구: 2026년 추천

ManimGL은 정밀한 코드 기반 애니메이션으로 설명형 수학 영상을 제작하는 3Blue1Brown의 오리지널 엔진입니다.

코드베이스와 LLM 위키를 탐색하고 질의할 수 있는 인터랙티브 지식 그래프로 바꾸는 Claude Code 플러그인 및 멀티 플랫폼 스킬 모음입니다.

아이디어, 계획, 코드베이스를 인터랙티브 HTML 다이어그램으로 만드는 에이전트 스킬

45가지 다이어그램 유형과 브랜드 맞춤을 지원하는 단일 HTML·SVG 에디토리얼 다이어그램 에이전트 스킬입니다.

기술 개념을 설명하는 실물 시스템의 인터랙티브 등각 SVG 일러스트를 만드는 Claude 에이전트 스킬입니다.

웹 앱에서 드래그하고 스냅할 수 있는 플로차트 편집기를 만드는 미니멀한 순수 JavaScript 라이브러리입니다.

시간에 따른 멀티모달 로보틱스 및 센서 데이터를 로깅하고 시각화·조회·스트리밍하는 오픈소스 Rust 툴킷입니다.

JS 코드를 추상화 수준·코드 블록 수정자·테마를 지원하는 SVG 순서도로 변환하는 JavaScript 라이브러리 및 CLI

텍스트 구문으로 SVG 인포그래픽을 생성하고 렌더링하는 선언형 엔진으로, AI 기반 생성과 스트리밍 출력에 적합합니다.

C4 기반 표기법으로 코드 기반 소프트웨어 아키텍처 다이어그램을 생성하는 모델링 언어와 도구 체인

일정에 따라 호스트와 서비스를 검색하고 네트워크 연결을 매핑해 네 가지 뷰를 최신 상태로 유지하는 셀프 호스팅 네트워크 스캐너입니다.

Git 커밋을 구문 강조와 파일 트리 전환 효과를 곁들여 타이핑 애니메이션으로 재생하는 터미널 도구입니다.

자연어 설명을 바탕으로 Claude Code 같은 에이전트가 Excalidraw 다이어그램을 생성하도록 하는 코딩 에이전트 스킬입니다.

AI 에이전트의 어려운 질문 답변을 다이어그램과 표를 갖춘 오프라인 HTML 페이지로 만드는 에이전트 스킬입니다.

코딩 에이전트가 독립 실행형 HTML 와이어프레임, 인터랙티브 프로토타입, 계획 및 다이어그램을 만들도록 돕는 에이전트 스킬 모음입니다.

LLM으로 주어-술어-목적어 트리플을 추출해 비정형 텍스트를 대화형 지식 그래프로 만듭니다.

가구 배치와 벽 편집, 2D 방 치수 측정부터 Three.js 3D 장면 확인까지 지원하는 프런트엔드 전용 평면도 도구입니다.

런타임 의존성 없이 Mermaid 다이어그램 텍스트를 SVG로 변환하는 경량 동기식 렌더러입니다.

브라우저에서 Web Audio API로 Milkdrop 프리셋을 렌더링하는 클래식 Milkdrop 음악 비주얼라이저의 WebGL 재구현체입니다.

실제 궤도 역학을 기반으로 학생, 교육자, 우주 작전팀을 위해 만든 브라우저 기반 3D 위성 추적기입니다.

AI 코딩 에이전트가 레시피, 키트, 프레임 캡처를 활용해 아이디어를 Three.js 또는 Blender 장면으로 구현하도록 안내하는 에이전트 스킬입니다.

Claude Code나 Codex 프로젝트를 방으로, 각 에이전트를 실시간 활동을 보여주는 픽셀 아트 캐릭터로 표현하는 가상 사무실입니다.

짧은 JSON 사양을 애니메이션과 탐색이 가능한 다이어그램으로 만들고 SVG, PNG, GIF 또는 MP4로 내보내는 Claude 및 코딩 에이전트용 스킬입니다.

코딩 에이전트가 일관된 스타일로 요소를 직접 배치한 SVG 다이어그램을 그리도록 돕는 에이전트 스킬이자 무의존성 린터입니다.

AI 코딩 에이전트가 다이어그램과 미리보기를 렌더링하고, 화면에서 주석을 달아 승인할 수 있는 Electron 메뉴 막대 앱입니다.

중력이 궤도를 만드는 원리를 안내 투어와 실제 천문 데이터로 보여 주는 TypeScript·Three.js 태양계 시뮬레이터입니다.