VJ Studio 是一款单文件 HTML 歌词视频合成工具，零依赖、离线可用。支持音频导入、歌词识别、多比例画面合成、动态背景、字幕动效和视频导出。
- 现代浏览器（Chrome / Edge / Firefox 最新版）
- 无需安装，直接双击 HTML 文件打开
- 建议内存 4GB 以上
- 打开
VJ-studio-optimized.html - 点击「快速 Demo」体验完整流程（自动载入示例音频和歌词）
- 或点击「上传音频」导入自己的 MP3/WAV 文件
- 导入 LRC 歌词文件，或使用「AI 语音识别」自动生成歌词
- 调整歌词时间轴
- 选择背景视频和字幕动效
- 选择画面比例（16:9 / 9:16 / 1:1 / 4:3）
- 点击「导出视频（MP4）」
- 上传音频：支持 MP3、WAV、M4A 等常见格式
- 生成节拍 Demo：自动生成示例节拍音频
- 音频 + LRC：从网易云/QQ音乐下载 MP3 与同名 .lrc，系统自动配对
- AI 语音识别：配置火山引擎 API，自动识别歌词文本与节拍
- 快速 Demo：零配置体验完整流程
- 提取 MP3 内嵌歌词
- 粘贴 LRC 歌词文本
- 导入音频 + LRC 文件配对
- 联网搜索歌词（按歌名/歌手）
- 智能对齐时间轴（可调节灵敏度）
- 每行歌词可单独提前/推迟 0.1 秒
- 整体提前/推迟 0.5 秒
- 导出 LRC 歌词文件
| 编号 | 名称 | 类型 |
|---|---|---|
| 1 | 海岸日落 | 渐变动态 |
| 2 | 黑雾烟场 | 烟雾漂移 |
| 3 | 流烟夜幕 | 视频循环 |
| 4 | 水墨雾影 | 渐变动态 |
| 5 | 水墨山水 | 渐变动态 |
| 6 | 霓虹波动 | 霓虹光晕 |
| 7 | 星空暗夜 | 星星闪烁 |
| 8 | 竹影月下 | 渐变动态 |
| 9 | 胶片旧梦 | 渐变动态 |
| 10 | 红黑摇滚 | 扫描线脉冲 |
| 11 | 极光幻境 | 渐变动态 |
| 12 | 暖金舞台 | 渐变动态 |
| 13-20 | 更多背景 | 渐变/视频 |
也可上传自己的 MP4 循环视频（≤50MB）。
横排效果（0-15）
- 效果0：国风竖排·大字背景
- 效果1：三行K歌·逐字高亮
- 效果2：多行K歌·当前行放大
- 效果3：经典底部·居中
- 效果4：渐入淡出
- 效果5：打字机
- 效果6：弹跳入场
- 效果7：霓虹发光
- 效果8：卷轴竖排·文字滚动
- 效果9：剧场滚动·三行
- 效果10：霓虹滚动·三行
- 效果11：朱砂竖排·印章
- 效果12：竹简竖排
- 效果13：极简竖排
- 效果14：墨韵落笔·竖排
- 效果15：流光扫光·霓虹
竖排科技风（16-20）
- 效果16：科技霓虹·青色扫描线
- 效果17：矩阵代码·绿色矩阵雨
- 效果18：全息投影·青色全息扫描
- 效果19：赛博故障·RGB三色错位
- 效果20：能量描边·金色发光边框
横排动效（21-26）
- 效果21：故障风·RGB通道持续分离+剪切
- 效果22：波浪·渐变文字+逐字起伏
- 效果23：霓虹脉冲·三色循环发光
- 效果24：打字机·循环打字+扫描线
- 效果25：弹跳·squash & stretch弹性
- 效果26：3D立体·整行旋转+深度阴影
- 16:9（1920×1080）：横屏视频，适合B站/YouTube
- 9:16（1080×1920）：竖屏视频，适合抖音/快手/视频号
- 1:1（1080×1080）：方形视频，适合Instagram/小红书
- 4:3（1440×1080）：经典比例
所有字幕效果均已适配4种比例，位置自动校准。
- 实时预览合成效果
- 播放/暂停控制
- 进度条拖拽跳转
- 时间显示（当前/总时长）
- 当前背景名称显示
- 硬件解码状态显示
- 点击「导出视频（MP4）」
- 导出分辨率与所选画面比例一致
- 包含音频、背景、字幕合成
- 保存工程：保存当前配置（音频、歌词、背景、效果、比例）
- 打开工程：加载已保存的工程
- 自动保存：编辑过程中自动保存，刷新不丢失
- 空格：播放/暂停
- 左右箭头：快退/快进 5 秒
Q: 音频无法播放？ A: 快速 Demo 模式会自动生成示例音频。上传音频后请确认文件格式支持。
Q: 字幕位置不对？ A: 所有效果已适配4种比例，切换比例后字幕会自动重新定位。
Q: 背景显示黑屏？ A: 部分背景使用 CSS 动态效果，需现代浏览器支持。红黑摇滚等背景已移除外部文件依赖。
Q: 导出失败？ A: 确保浏览器支持 MediaRecorder API，建议使用 Chrome 或 Edge。
Q: 页面卡顿？ A: 本工具为单文件应用，部分动态效果较消耗性能。建议关闭其他占用资源的程序。
- 纯前端实现，无后端依赖
- 单文件 HTML，内嵌所有资源
- 音频使用 Web Audio API 处理
- 视频导出使用 MediaRecorder API
- 字幕渲染使用 Canvas + DOM 混合方案
- 背景使用 CSS 动画 + 视频帧数据
版本：v3.5.0 更新日期：2026-09-03