/programming-notes/ScrapboxのThemeの仕様

generated at 2/14/2025, 12:52:05 AM
ScrapboxのThemeの仕様

custom properties
Scrapboxの背景色
 --body-bg 
scrapboxのページカード系
txt--card-box-hover-shadow: 0 2px 0 rgba(0, 0, 0, .23);
--card-description-code-color: #342d9c;
--card-title-color: #444;
--card-title-bg: #f2f2f3;
--card-bg: #fff;
--card-hover-bg: rgba(0, 0, 0, .05);
--card-active-bg: rgba(0, 0, 0. .1);
--card-backside: #aaa;
--card-description-color: #7a7a7a;
--card-description-link-color: #6e8af3;
--card-box-shadow-color: #b0b1b3;
--card-box-shadow: 0 2px 0 var(--card-box-shadow-color);
--card-title-bg-pinned: #f2f2f3;
関連ページリストのヘッダー
txt--relation-label-bg: #edeeee;
--relation-label-text: #444;
--relation-label-links-bg: #6e8af3;
--relation-label-links-text: #fff;
--relation-label-empty-bg: #fb7476;
--relation-label-empty-text: #fff;
brand icon (Scrapbox)の画像
 --logo-url 
brand icon (Scrapbox)の色
txt--navbar-icon-color: #fff;
--navbar-icon-active-color: rgba(255, 255, 255, .5);
--navbar-icon-hovered-color: var(--navbar-icon-active-color);
New Button (Scrapbox)の色
txt--new-button-bg: #fff;
--new-button-hover-bg: rgba(255, 255, 255, .7);
--new-button-active-bg: rgba(255, 255, 255, .5);
--new-button-vertical-color: var(--navbar-bg);
--new-button-horizontal-color: var(--navbar-bg)
nav barの色
 --navbar-bg 
検索バー
txt--search-form-bg: rgba(255, 255, 255, .2);
--search-form-text-color: rgba(255, 255, 255, .5);
--search-form-icon-color: #fff;
--search-form-icon-focus-color: #4a4a4a;
PageMenuの色
txt--tool-bg: rgba(0, 0, 0, .1);
--tool-color: #a0a0a0;
--tool-light-color: #c6c6c6;
--tool-badge-bg: #edeeee;
--tool-bg: #edeeee;
--tool-text-color: #444;
Editorの色
txt--page-bg: #fff;
--page-text-color: #444;
--line-title-color: #444;
--code-bg: #f3f3f3;
--cursor-color
リンクの色
txt--page-link-color: #6e8af3;
--page-link-hover-color: #3f57b1;
--page-link-color-cursor-line: #8159c3;
--empty-page-link-color: #fb7476;
--empty-page-link-hover-color: #cf554d;
テロメアの色
txt--telomere-border: #edeeee;
--telomere-unread: #6e8af3;

#scrapboxのtheme