哔哩哔哩是什么风格？
bilibili 把一个信息密集的冷灰视频流，和一抹热粉、一块暗色播放器放在一起——白字描边的弹幕像天气一样从画面上掠过。
哔哩哔哩速览
bilibili 是一种中文视频平台风格，由两种相反的温度搭成。页面本身是信息密集的冷浅灰，上面堆叠着白色卡片，冷静得近乎工业。与之对照，品牌粉出现在关注按钮、角标、选中的标签页和未读标记上，而视频播放器则像一扇暗色的窗，坐在浅色页面的中间。这套风格示范了：一个中性的框架，如何让少数几个热色信号显得格外响亮。
它最鲜明的特征是弹幕，也就是滑过视频画面的观众评论层。在这套风格里，评论是带深色描边的白色小字，分成几条轨道，以匀速从右向左划过，互相叠着也不躲。弹幕是页面上唯一的“戏剧”：播放器之外一切都很安静，于是所有的动感与个性都集中在视频所在的位置。
版面里没有一处是空灵的。卡片标题限制在两行以内，次要信息用暗淡的灰，一屏要装下很多张卡片。没有巨大的标题，没有渐变，也没有纸张纹理。它的逻辑是：密度不是需要用留白去解决的问题，而是信息流本身的特点——人们浏览它的方式，就像浏览一排货架。
哔哩哔哩从何而来？
bilibili 2009年以 Mikufans 之名起步，2010年更名为 bilibili，2018年在纳斯达克上市。背景资料把它放在上海，并列出徐逸与陈睿两位核心人物。这套风格所记录的当前视觉系统大致形成于2022至2024年，所以它呈现的是一家早已走出创业期的公司的样子，信息流界面经过了为海量用户而做的打磨。
真正塑造它身份的是背后的几股潮流。第一股是中国的 ACG 与二次元亚文化，也就是动画、漫画、游戏爱好者的社群，以及围绕他们长出来的“二次元”趣味。第二股是弹幕视频，由 Niconico 引入：把评论挂在视频的精确时刻上，让它们滑过画面，把观看变成一件共享的、同时发生的事。第三股是 Vocaloid 与 UP主 创作者文化，业余和半职业的上传者——UP主——在这里制作并分享音乐、二创和其他作品。平台最初的名字 Mikufans，也指向同一个方向。
弹幕解释了界面为什么长成这样。如果评论要承担全部的能量，周围的界面外壳就必须让开道路。结果是一个反直觉的设计：一个亚文化平台，页面看上去却更像一张实用的索引，而不是粉丝站。浅灰、白卡和近乎黑色的正文提供了稳定、易读的表面，而粉色，连同 logo 里的青色，被允许成为唯一看起来像青年文化的东西。
把黑暗留在播放器里，是最后一块拼图。看视频自然适合暗色环境，但让整个网站变暗，信息流就会变成一堵墙。这套风格则让“暗室”只以一块宽屏矩形的形式存在于明亮的页面之中，观众在浏览与观看之间切换，界面却不改变情绪。
哔哩哔哩的视觉特征是什么？
冷灰底色
页面底色是带一丝蓝调的浅灰，既中性到不与内容争抢，又冷到足以让白色显得像一种独立的材质。白色卡片站在它上面，像有边缘的物件，底色与卡片之间的反差取代了边框和阴影，成为分隔内容的主要办法。
热粉只给交互
品牌粉是界面里唯一的暖色，被分配给交互与状态：关注按钮、角标、选中的导航标签和未读标记。由于页面其余部分又冷又中性，哪怕一小块粉色也是视线最先找到的东西。logo 里的青色是它的冷色对位，出现的频率低得多。
窄窄一档档的灰
文字被组织成一小段阶梯：标题和正文用近乎黑色，播放量、日期等元信息用暗淡的灰，细分隔线则用极淡的灰。这个阶梯刻意收得很窄，使得一屏满满的卡片无需任何装饰来区隔，也依然可读。
密集的白卡片
卡片是纯白的，排得很紧，结构统一：一张缩略图，一个限制在两行的标题，下面一行元信息。标题和元信息的字号都不大，所以一屏可以放很多卡片。这种密度是有意为之——信息流是用来扫视和挑拣的，像看货架，而不是像读文章。
弹幕层
弹幕是带深色描边的白色小字，这样无论画面是哪一帧都读得清。评论沿几条平行轨道以恒定速度从右向左滑动，彼此可以自由重叠。效果像一群人在画面上方七嘴八舌地说话，而恒定的速度和描边让这群人保持可读，而不是一团混乱。
亮页里的暗色播放器
整套系统里唯一的暗色表面是宽屏视频播放器。它坐在浅色页面里，却不取代页面，因此从浏览到观看的转换只是换了一个画框，而不是换了一个主题。这种“被包住”的处理，也给弹幕提供了一个与界面明显分开的舞台。
不加装饰
界面外壳里没有大标题，没有渐变，也没有纸张纹理。平台的个性来自它的内容与评论，而不是它的容器。正是这种克制，让用户自制的缩略图——色彩缤纷、各不相同——成为页面上最响亮的东西。
谁塑造了哔哩哔哩？
徐逸是 bilibili 背景资料所列的两位核心人物中的第一位。他的名字属于平台的起点：2009年以 Mikufans 之名开始，次年更名为 bilibili。资料没有描述他的具体角色，本文也不妄加。他与这套风格的关联，在于他所系的那个时刻：弹幕视频被带入中文互联网文化的时刻。
陈睿是被点名的第二位核心人物。他的名字与这家公司相连：从 Mikufans 起步，走到2018年在纳斯达克上市。这套风格记录的是那段成长在视觉上的结果——哪怕用户规模不断扩大，界面依然保持冷静、密集、冷灰，热粉和暗色播放器是仅剩的响亮元素。
Niconico 不是个人，而是背景资料中被认定为弹幕视频来源的影响。把观众评论叠加在视频时间轴上的做法，就是从它传到了 bilibili。在这里点出它，是承认这套风格的标志性特征——描边评论在暗色播放器上飞驰——是一种继承来的形式，bilibili 把它改造成了适合自己界面和社群的样子。
今天怎么用哔哩哔哩？
bilibili 风格适合那些必须信息密集、便于快速扫视、又带一点玩心的界面。它的方法一句话就能说清：搭一个冷静的冷灰框架，把颜色花在寥寥几个信号上。做起来却不容易，因为每一处粉色都得挣到自己的位置。
在演示文稿里，bilibili 式的封面是一块冷灰底，上面一张白卡和一处粉色，而不是一张粉色铺满的海报。内容页读起来像信息流页面：灰底上的白卡，标题用近乎黑色，元信息用暗淡的灰。数据页适合排行榜和榜单表，把第一名或增长数字用粉色挑出来。在浅色幻灯片里放一个暗色矩形，里面是截图或视频静帧，就借到了播放器的思路。
在网页界面里，它适合内容信息流、社区平台、创作者后台，以及视频和直播的前端。关注、订阅和通知状态用粉色，其余保持灰、白、黑。仪表板应当是灰底上的白卡，指标字小、用暗淡的灰，只把发生变化的那个数字用粉色高亮。会员或定价页，只要把想推荐的那个方案做成唯一带粉色标记的卡片就行。评论或直播聊天可以借用弹幕的处理——描边白字在暗色媒体面上移动——前提是这块暗色面保持被包住。
对于编辑与营销页面，把粉色当作行动号召，把灰、白、黑体系当作阅读表面。面向创作者或粉丝社群的产品，其活动页可以放一个暗色的主播放器或静帧，让叠加的评论暗示出一群观众。标题保持克制。这套风格的能量来自内容密度和冷热反差，而不是大号展示字。
常见的错误是让整页淹没在粉色里，这会抹掉整套系统赖以成立的反差。第二个错误是为了“视频感”把整页调暗，这会破坏播放器的“被包住”。第三个错误是为了显得年轻而加柔和阴影、渐变或纸张质感。这套风格的年轻感来自评论和缩略图，外壳始终是扁平的。
哔哩哔哩 · 常见问题
弹幕是什么？
弹幕，字面意思是“子弹的幕布”，是在评论被写下的那个时刻滑过视频画面的一层观众评论。这项技术由 Niconico 传到 bilibili。在这套风格里，评论是带深色描边的白色小字，分几条轨道以匀速从右向左移动，并且允许彼此重叠。
为什么页面底色是冷灰而不是白色？
带一丝蓝调的浅灰，让白色卡片无需边框或阴影就能被识别为独立的物件。它也不会挡住真正重要的颜色：用于交互的粉色和 logo 的青色。如果页面是纯白，卡片就会融进底色里，粉色也少了一个可以对撞的背景。
页面是亮的，为什么播放器是暗的？
看视频适合暗的环境，但整站变暗会让浏览用的信息流显得沉重、也更难扫视。这套风格把暗色留在宽屏播放器里，观看时有一个类似影院的画框，页面其余部分则仍是明亮而密集的索引。它也让描边评论有了一个与界面明显分开的舞台。
粉色应该用在哪里？
用在交互与状态上：关注按钮、角标、选中的标签页和未读标记。判断标准是：这个元素是不是在要求用户去做什么或留意什么。不是的话，就保持灰、白或黑。把粉色用在标题、背景或装饰形状上，会稀释冷框架与热信号之间的反差，而这种反差正是风格能量的来源。
这套风格适合非视频类的产品吗？
适合，只要内容是由活跃社群塑造的密集信息流：论坛、创作者平台、直播、学习社区、音乐或游戏聚合站。对于稀疏、高端或需要沉思的产品，它就不太合适，因为这套风格预设了高密度、一屏多卡，以及快速浏览的用户。
