直播互动工具

弹幕姬

设置弹幕样式、颜色和速度,生成OBS浏览器源弹幕悬浮窗。纯本地运行,数据不上传,保护隐私。

🔒 纯前端弹幕渲染 · 无需后端 · OBS浏览器源直接嵌入 · 支持自定义弹幕接入
弹幕预览区 · OBS浏览器源可嵌入
● 运行中 | 弹幕: 0
📊 统计
0
总弹幕
0
屏幕上
8
速度
🎨 弹幕样式
默认 B站风 霓虹 极简 粗体
#ffffff
#000000 (透明度下方调整)
📺 OBS嵌入
💡 在OBS中添加「浏览器」源,粘贴下方URL,设置宽高匹配直播间。弹幕将透明叠加在直播画面上。
OBS浏览器源URL:
点击「生成OBS链接」
🔌 弹幕接入(高级)
⚠️ 本工具不内置弹幕抓取功能。接入实时弹幕需配合第三方弹幕抓取工具(如弹幕库、blivedm等),通过WebSocket推送至本页面。
未连接

🔗 相关工具

实时同传字幕

BYOK语音转文字

OBS挂件生成器

直播挂件样式

直播音效台

一键播放音效

多人连麦

PeerJS视频连麦

📖 弹幕姬使用指南

什么是弹幕姬?

弹幕姬是直播中用来显示弹幕的悬浮层工具。观众发送的弹幕以滚动文字的形式叠加在直播画面上,增强互动氛围。本工具提供弹幕样式自定义、测试发送和OBS嵌入功能,让你无需复杂配置即可拥有专业弹幕效果。

使用方法

接入真实弹幕

本工具专注弹幕渲染,不内置弹幕抓取功能。如需接入B站、抖音等平台的实时弹幕,需配合第三方弹幕抓取工具:使用blivedm等开源库连接平台弹幕服务器,通过WebSocket将弹幕文本推送到本页面。在「弹幕接入」面板填入WebSocket地址即可接收实时弹幕。

OBS浏览器源配置

在OBS中:添加源 → 浏览器 → 勾选「本地文件」取消 → URL粘贴生成的链接 → 宽度设为1920(或直播间宽度) → 高度设为1080(或直播间高度)。添加CSS:body { background: rgba(0,0,0,0); } 确保背景透明。在OBS中拖动浏览器源到最上层即可。

常见问题

能直接抓取B站/抖音的弹幕吗?

不能。本工具专注弹幕渲染展示,不内置弹幕抓取功能。抓取平台弹幕需使用第三方工具(如blivedm),通过WebSocket推送至本页面渲染。这是出于合规考虑的设计——弹幕抓取可能涉及平台协议,需用户自行承担风险。

如何在OBS中设置透明背景?

在OBS浏览器源属性中,确保不勾选「关闭自定义CSS」。默认CSS已包含透明背景设置。如仍有背景,可手动添加:body { background: rgba(0,0,0,0) !important; }

弹幕太多会卡顿吗?

本工具使用CSS transform动画,性能较好。建议同屏弹幕不超过50条。可通过调整轨道数和速度控制密度。如需更高性能可在设置中关闭背景模糊。

支持哪些弹幕类型?

支持三种类型:滚动弹幕(从右向左滚动)、顶部弹幕(固定在顶部居中)、底部弹幕(固定在底部居中)。可在样式设置中切换。

可以自定义弹幕字体吗?

支持系统字体。弹幕默认使用无衬线字体。如需自定义字体,可在OBS浏览器源的自定义CSS中添加:body { font-family: '你的字体名'; }