Skip to content

Bilibili Tint Color by invalidunit

Mirrored from https://raw.githubusercontent.com/invalidunit/css_stylus/main/bilibili_tint_color.user.css

Details

Authorinvalidunit

LicenseNo License

Categorybilibili.com

Created

Updated

Size3.9 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Bilibili 自定义主色调(强调色)

Notes

Userstyle doesn't have notes.

Source code

/* ==UserStyle==
@name				Bilibili Tint Color
@namespace			github.com/openstyles/stylus
@version			0.1.5
@description		Bilibili 自定义主色调(强调色)
@author				zhaonan
@preprocessor		stylus

@advanced number color-img "图片变色百分比" 150
@advanced color color-0 "color-0" #FF7790
@advanced color color-1 "color-1" #FF4455
@advanced color color-2 "color-2" #FF778921

==/UserStyle== */

@-moz-document domain("bilibili.com") {
	/* 全局变量 */
	:root{
		--brand_blue: color-0 !important;
		--text_link: color-0 !important;
		--Brand_blue: color-0 !important;
		--v_brand_blue_thin: color-2 !important;
	}
	/* 全局变量 */
	::selection{
		background: color-1 !important;
	}
	/* 扭曲弹幕开关颜色 */
	.icon.normal,.icon.video,.icon.search-word,.bui-danmaku-switch-label,input[type="checkbox"]{
		filter: hue-rotate(color-img deg) !important;
	}
	/* 扭曲列表正在播放颜色 */
	.cur-play-icon{
		filter: hue-rotate(color-img deg) !important;
	}
	.link-content img{
		filter: hue-rotate(color-img deg) !important;
	}
	/* 修改开关颜色 */
	.be-switch-container.is-checked .be-switch{
		background-color: color-0 !important;
	}
}

@-moz-document domain("space.bilibili.com") {
	/* 个人主页 */
	/* “主页”下划线颜色 */
	.n-cursor{
		background: color-1 !important;
	}
	/* “我的粉丝会看到”和“最新发布”下划线颜色 */
	.be-tab-cursor{
		border-bottom: 1px solid color-1 !important;
	}
	/* “我的粉丝会看到”和“最新发布”下划线上方三角形颜色 */
	.be-tab-cursor:after{
		border-bottom: 3px solid color-1 !important;
	}
	/* 扭曲搜索放大镜图标颜色 */
	.icon.search-btn:hover{
		filter: hue-rotate(color-img deg) !important;
	}
	/* 公告边框颜色 */
	.content #i-ann-content textarea:hover{
		border-color: color-1 !important;
	}
	/* 扭曲设置置顶视频颜色 */
	.i-pin-empty-set.list-create:hover{
		filter: hue-rotate(color-img deg) !important;
	}
	.i-pin-empty-set.list-create{
		transition: filter -1s ease !important;
	}
	/* 激活的选项卡颜色 */
	.be-tab-item.is-active{
		color: color-1 !important;
	}
	.n .n-btn.active{
		color: color-1 !important;
	}
	.n .n-btn:hover{
		color: color-1 !important;
	}
	/* 扭曲右上角信息颜色 */
	.n-statistics a:hover{
		filter: hue-rotate(color-img deg) !important;
	}
	/* 扭曲我的视频旁边按钮颜色 */
	.section-title a:hover{
		filter: hue-rotate(color-img deg) !important;
	}
	.section-title a{
		transition: filter -1s ease !important;
	}
	.channel-title div:hover{
		filter: hue-rotate(color-img deg) !important;
	}
	.channel-title div{
		transition: filter -1s ease !important;
	}
	/* 个人主页下方视频标题颜色 */
	.detail a:hover{
		color: color-1 !important;
	}
}

@-moz-document domain("message.bilibili.com") {
	/* 消息中心 */
	/* 我的消息中链接颜色 */
	.space-right .space-right-top .title{
		background-color: color-0 !important;
		color: #FFF !important;
	}
	/* 我的消息中链接颜色 */
	.im-dynamic-link{
		color: color-1 !important;
	}
	.link{
		color: color-1 !important;
	}
	/* @我的中@颜色 */
	.at{
		color: color-1 !important;
	}
	/* 左边选项卡鼠标放上去颜色 */
	.item:hover{
		color: color-0 !important;
	}
	.item a:hover{
		color: color-0 !important;
	}
	/* 左边激活选项卡小圆点 */
	.item.active{
		color: color-0 !important;
	}
	/* 左边激活选项卡文字 */
	.router-link-exact-active.router-link-active{
		color: color-0 !important;
	}
	/* 收到的赞中的删除通知和不再通知颜色 */
	.action-button:hover{
		color: color-0 !important;
	}
	/* 消息设置中的开关颜色 */
	.radio-icon.css-o1815x .border{
		fill: color-0 !important;
	}
	.radio-icon.css-o1815x .dot{
		fill: color-0 !important;
	}
}

Reviews

No reviews yet.