映间 MARGIN

给 B 站换一个更清晰的界面。

编辑式排版、液态玻璃控件、动态背景，保留熟悉的原生播放体验。

A quieter interface for Bilibili, with clean layouts, liquid glass controls and animated backgrounds.

下载扩展 · 快速开始 · 功能 · 常见问题 · 更新日志 · 反馈问题

简体中文 | English

English summary

> MARGIN is an open-source Edge / Chrome / Firefox extension that redesigns Bilibili's homepage, search, video and reading pages. It keeps the native player, danmaku and comments, while adding themes, recommendation filters, favorites shortcuts and a local activity heatmap. Settings and activity records stay on your device; weather uses third-party location and forecast services. Read the full English README.

界面预览

| 浅色首页 | 暗色首页 | | :---: | :---: | | !浅色主题下的推荐流与足迹热力图 | !暗色主题下的推荐流与动态背景 |

截图展示主要界面，具体样式以当前版本为准。

快速开始

1. 从 最新版本 下载 margin.zip，解压到固定文件夹。
2. 打开 edge://extensions 或 chrome://extensions，开启开发者模式。
3. 点击加载已解压的扩展程序，选择包含 manifest.json 的文件夹。
4. 打开或刷新 B 站。

Firefox（140 及以上）：从 Firefox 附加组件商店安装（推荐，可长期使用并自动更新）。备用方式：下载 margin-firefox.zip（直链，始终是最新版），打开 about:debugging#/runtime/this-firefox，点击临时载入附加组件，选择这个 zip；临时载入的扩展在重启 Firefox 后会被移除。

其他 Chromium 内核浏览器（Brave、Opera、Vivaldi、Arc 等）可以按 Chrome 的步骤安装，但未逐一测试。Safari 暂不支持。

功能

| 模块 | 可以做什么 | | --- | --- | | 首页与搜索 | 个性推荐、热门视频、无限加载、换一批，以及关键词、UP 主、播放量和时长过滤。 | | 原生播放 | 重新排版标题、UP 主卡片、选集与推荐列表，保留原生播放器、弹幕、评论、清晰度及全屏操作。 | | 弹幕空降 | 可选，默认关闭；认得出时间点的弹幕（如「03:20」「空降 2:15」）加下划线，点击跳转后可撤销。只在本机解析弹幕文本，不联网。 | | 收藏与稍后再看 | 玻璃文件夹收藏抽屉、稍后再看列表、观看进度和视频右键菜单。 | | 足迹 | 年 / 月热力图、每日首次打开时间与停留时长、观看历史补全、数据来源提示。 | | 阅读与账号页面 | 动态、图文、专栏的阅读布局，以及个人空间、历史、动态流和消息页面的统一界面；私信支持图片预览发送和原版表情选择。 | | 外观与背景 | 亮色、暗色、跟随系统；13 款动态背景、自定义图片与强度调节，包含汇流和点击冲击波。 | | 快捷操作 | 搜索联想、命令面板、悬停预览、可翻面的头像工牌和可修改城市的天气卡片。 | | 本地数据 | 设置与足迹保存在本机，可导出和导入 JSON 备份。 |

部分账号功能需要登录 B 站；是否可用也受 B 站自身的接口、权限与地区限制影响。

常见问题

怎么临时回到 B 站原版？

在顶栏菜单选择原版，或在页面链接中添加 ?margin=off。也可以在扩展弹窗中关闭 MARGIN。

会替换播放器或影响我的账号吗？

播放仍由 B 站原生播放器负责。扩展使用你当前的 B 站登录状态请求页面所需的数据；收藏、稍后再看等操作仍通过 B 站接口完成。

会自动更新吗？

手动加载的解压版需要按上面的步骤更新；弹窗会提示 GitHub 新版本。从 Edge 商店安装的版本由浏览器分发审核通过的更新。

动态背景是否一直运行？

页面可见且有显卡加速时，背景在滚动、视频播放和打开抽屉期间保持动态；标签页隐藏时暂停，并遵循系统的“减少动态效果”设置。无显卡加速时保留静态保护，避免软件绘制拖慢页面。开场动画覆盖页面时会暂缓底层背景绘制。渲染采用自适应调度，实际帧率取决于设备和页面负载，不保证所有场景固定 60fps。参见性能说明。

隐私

开发者不运营统计或数据收集服务器。设置、足迹与自定义背景保存在本机；导出备份由你自行保存。

0.6.4 起，「设置 → 隐私」中的外部辅助服务和最近搜索记录默认关闭。允许外部辅助服务后可使用天气、社区广告片段和手动版本查询。最近搜索开启后只存扩展内，最多 8 条，30 天过期并在读取时清理。App 推荐流授权仅保留在当前浏览器会话，升级后的首次使用及重启浏览器后需重新扫码。

天气功能会请求 ipwho.is 获取粗略城市定位，并向 Open-Meteo 请求城市搜索和天气预报；这些服务会收到必要的 IP、城市或坐标信息。B 站账号、收藏与观看历史不会发送给天气服务。完整说明见隐私政策。

可选的「跳过视频内广告」默认关闭。开启后向小电视空降助手查询 BVID 的四位哈希前缀，只按社区广告标记跳过普通 BV 视频，支持撤销；不向该服务发送 B 站 Cookie、账号或完整视频 ID，不保证 B 站完播率。

本扩展为独立开源项目，非 bilibili 官方产品，与哔哩哔哩无关联。

开发与贡献

使用 Node.js 22 安装依赖并构建：

npm ci
npm run build

构建结果在 dist/，可直接作为解压扩展加载。在提供 zip 命令的环境中运行 npm run pack，会生成 margin.zip。

页面使用原生 TypeScript、CSS 和 Shadow DOM；Vite 按路由拆分页面模块，后台 service worker 负责合并足迹计时，中文字体按字符范围分包。

欢迎报告问题或提出建议。提交界面修改时，请附上页面地址、复现步骤和截图；修改播放页时保留 B 站原生播放能力。设计来源与第三方署名见设计参考与致谢。

• 21st「Video Player」（chetanverma16）：播放器浮动控制坞（v0.40.0）
• 21st「Post Card」（shadcnui-blocks）：播放页播放器 + 互动 + 简介合成一张卡片（v0.41.0）
• 21st「Comment Thread」（klyv-ui）：楼中楼对话树的限深缩进与细引导线（v0.49.0）

许可

MIT License © 2026 jiuyang5354。第三方组件、字体与素材的许可分别见设计参考与致谢和字体许可说明。