Settings
スタイルを変更できる
ref /help-jp/UserCSS
font
code:style.css
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&display=swap');
.line {
font-family: 'JetBrains Mono', 'Noto Sans JP', sans-serif;
}
.title, .line-title {
font-family: 'JetBrains Mono', 'Noto Sans JP', sans-serif;
font-weight: 700;
}
過去に使ったもの
Kosugi Maru
Murecho
M Plus 1p
Noto Sans JP
強調にカラーマーカーをつける
code:style.css
.line strong {
background: linear-gradient(180deg,rgba(255,255,255,0) 50%, #f3fd7f 50%);
}
背景模様
飽きたら https://projects.verou.me/css3patterns/ から好きなCSS拾うか、AIにデザインさせる
code:style.css
body {
background-image: radial-gradient(circle at 70% 30%, rgba(212, 235, 242, 0.8), rgba(188, 200, 242, 0.8));
}
過去に使ったもの
Cicada Stripes
ヘッダ
code:style.css
#app-container > div > nav > div > div.left > a > span {
color: #353535;
}
#app-container > div > nav {
background-image: linear-gradient(to right, #a6d0eb, #b5c8ed);
}
navbarのアイコン
code:style.css
.navbar-brand::before {
content: '';
width: 30px;
height: 30px;
background-image: url(https://avatars.githubusercontent.com/u/1811616?s=30);
background-size: cover;
border-radius: 15px;
}
.brand-icon {
display: none;
}