diffusion-explainer

在浏览器里一步步拆解 Stable Diffusion，看懂 AI 绘画过程

开源 🏷️完全免费 ✅ 目前可打开 图像生成 🍴 复刻 65 👀 关注 10
访问官网 ↗ GitHub ↗
GitHub 星标 ★ 508
维护状态 低维护
是否开源 开源
定价模式 🏷️完全免费 完全免费，开源项目，提供在线交互式可视化演示，无需付费。

项目预览

diffusion-explainer 项目界面预览图
图片来源：GitHub 官方仓库名片

项目数据

分类图像生成
开发团队poloclub
官网地址https://poloclub.github.io/diffusion-explainer
GitHubhttps://github.com/poloclub/diffusion-explainer
定价模式🏷️完全免费
价格说明完全免费，开源项目，提供在线交互式可视化演示，无需付费。
访问状态✅ 目前可打开
是否开源是
开源协议MIT
主要语言JavaScript
技术栈/模型clip,deep-learning,generative-model,interactive-visualization,machine-learning,stable-diffusion,unet,visual-learning,visualization
GitHub 星标★ 508
上线时间2022-12-27 00:00:00
代码更新2024-08-31
仓库体积5.20 GB
本站数据更新2026-11-09
维护状态低维护
收录时间2026-08-09
浏览次数2

项目介绍

Diffusion Explainer 是一个交互式可视化工具，旨在帮助用户直观理解文本到图像生成模型（如 Stable Diffusion）的内部工作原理。它通过浏览器端运行，将复杂的深度学习模型（包括 CLIP 文本编码器、UNet 去噪网络和 VAE 图像解码器）拆解为可交互的步骤，用户输入文本提示后，可以逐步观察噪声图像如何被逐步去噪并最终生成对应图像。该工具解决了深度学习模型“黑盒”问题，使研究者、教育者和爱好者无需深入代码即可探索扩散模型的机制。核心能力包括：实时可视化去噪过程、展示注意力权重、对比不同提示的效果，以及提供简化的模型架构图。项目基于 JavaScript 和 Web 技术，无需安装即可在浏览器中体验，适合教学演示和科普。

Star 增长趋势

本站每日记录该项目 GitHub 星标变化，观测越久曲线越完整

数据来源：GitHub API 逐日快照 · 收录于 2026-08-09 · 当前星标 ★ 508

使用教程

难度：入门 约 20 分钟 部署方式：无需部署 4 步

环境要求

  • Python 3（可选）

安装与启动步骤

  1. 1拉仓库

    纯前端可视化，无后端。

    git clone https://github.com/poloclub/diffusion-explainer.git

  2. 2起静态服务

    直接双击打开会缺资源。

    python -m http.server 8000

  3. 3按步骤点下去

    它按去噪步数一步步演示，跟着点最有收获。

  4. 4对照自己的提示词

    换个提示词再走一遍，理解会更具体。

如何确认成功

按演示步骤能看清每一步去噪后图像的变化，换成自己的提示词后同样能跑完整流程

注意事项

  • 它是解释文生图模型如何把提示词变成图像的可视化教学工具。
  • 价值在把每一步去噪结果摊开给你看，不是生成图片。
  • 纯静态资源，起个服务就能跑。
  • 用来给学生或非技术同事讲原理最合适。

核心亮点

  • 交互式可视化去噪过程，直观展示每一步噪声到图像的转变
  • 无需安装，浏览器直接运行，降低学习门槛
  • 支持自定义文本提示，实时对比不同输入对生成结果的影响

不足之处

  • 仅支持简化版模型，无法完全复现完整 Stable Diffusion 的生成质量
  • 文档和社区支持较少，扩展性有限

适用场景

  • 教学演示：在课堂或讲座中解释扩散模型原理
  • 科普传播：向非技术人群展示 AI 绘画背后的过程
  • 开发调试：帮助研究者理解模型内部特征和注意力机制

替代项目

Latent Diffusion Model Visualization、Stable Diffusion WebUI (AUTOMATIC1111)、Distill.pub 的扩散模型解释文章

上一篇：AnkiAIUtils

下一篇：VP-StableDiffusionBook

同类项目推荐

transformers-explained 开源

手把手拆解 Transformer，从零看懂大模型核心原理

Transformer architecture explained step by step - the full architecture, every atten···

★ 230 2026-08-09
universal-diagnostic-tutor-skill 开源

先测出你的知识漏洞，再对症下药，学啥都事半功倍

One diagnosis-first AI tutor for STEM, AI/CS, and beyond — no mode or command menu.···

★ 260 2026-08-09
Agent-For-Dummies 开源

零基础中文笔记加编程平台，边学边跑通 Agent 与 RAG

Agent/RAG/AI应用：Agent零基础入门学习笔记➕编程平台

★ 165 2026-10-21
ai-system-design 开源

从会调API到会搭AI系统，一步步教你设计LLM应用架构

AI System Design - Learn how to design AI systems built on LLMs, RAG, and AI Agents ···

★ 845 2026-10-02
Awesome-Prompt-Engineering 开源

系统整理提示工程资源，快速上手GPT应用开发

This repository contains a hand-curated resources for Prompt Engineering with a focu···

★ 6438 2026-08-09
awesome-ai-engineering 开源

一份清单带你从零走通 AI 工程学习与落地路线

A curated collection of AI engineering resources, roadmaps, tools, and projects cove···

★ 22540 2026-10-23