README.md

metadata

title: Code Snapshot Studio
emoji: 📸
colorFrom: indigo
colorTo: purple
sdk: docker
app_port: 7860
pinned: false
short_description: 代码截图工坊

Code Snapshot Studio (代码截图工坊)

Code Snapshot Studio 是一个专为开发者设计的代码截图生成工具，帮助你创建美观、高清晰度的代码图片，用于技术博客、社交媒体分享或演示文档。

✨ 核心功能

• 多语言支持：支持 Python, JavaScript, Go, Rust, Java 等多种主流编程语言的语法高亮，并内置丰富代码示例。
• 主题切换：内置 Tomorrow (Dark), Okaidia, Solarized Light, Twilight 等多种经典配色主题。
• 高度定制：
  • 调整内边距 (Padding)
  • 切换多种精美背景风格 (渐变色/纯色)
  • 窗口控件开关 (Mac 风格红绿灯)
  • 行号显示开关
  • 自定义窗口标题
• 移动端适配：响应式设计，支持手机端操作。
• 高清导出：基于 HTML2Canvas，一键导出 2x 分辨率的高清 PNG 图片。
• 实时预览：所见即所得的编辑体验。

🚀 快速开始

本地运行

1. 克隆仓库：

   git clone https://github.com/yourusername/code-snapshot-studio.git
   cd code-snapshot-studio
   

2. 安装依赖：

   pip install -r requirements.txt
   

3. 启动应用：

   python app.py
   

4. 打开浏览器访问：http://localhost:7860

Docker 部署

docker build -t code-snapshot-studio .
docker run -p 7860:7860 code-snapshot-studio

🛠️ 技术栈

• Backend: Flask (Python)
• Frontend: Vue.js 3, Tailwind CSS
• Syntax Highlighting: Prism.js
• Image Generation: html2canvas

📝 License

MIT License