gistfile1.css

:root {
    --font-family:
            Roboto,
            "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic",
            "Hiragino Kaku Gothic ProN",
            "メイリオ",
            sans-serif;

    --base-color: rgb(255, 255, 255);
    --main-color: rgb(155, 155, 155);
    --text-color: rgb(0, 0, 0);

    /* 動作確認用1(背景:白) */
    /*--base-color: rgb(255, 255, 255);*/
    /*--main-color: hsl(235, 61%, 49%);*/
    /*--text-color: rgb(0, 0, 0);*/

    /* 動作確認用2(Darcula) */
    /*--base-color: hsl(231, 15%, 18%);*/
    /*--main-color: hsl(232, 14%, 31%);*/
    /*--text-color: hsl(60, 30%, 96%);*/
    /*--star-count-foreground: hsl(31, 100%, 71%);*/
    /*--star-count-background: hsl(65, 92%, 76%);*/
    /*--tag-label-foreground-color: var(--base-color);*/
    /*--tag-label-background-color: hsl(225, 27%, 51%);*/
    /*--app-frame-color: var(--main-color);*/
    /*--badge-image-count-foreground-color: hsl(60, 30%, 96%);*/
    /*--badge-image-count-background-color: var(--base-color);*/
    /*--badge-image-count-border-color: rgb(216, 216, 216);*/
    /*--badge-text-foreground-color: hsl(60, 30%, 96%);*/
    /*--badge-text-background-color: var(--base-color);*/
    /*--badge-text-border-color: red;*/
    /*--the-calendar-not-current-month-color: hsla(232, 14%, 31%, .8);*/
    /*--the-pagination-current-foreground-color: black;*/
    /*--the-pagination-current-background-color: white;*/
    /*--the-pagination-hover-background-color: green;*/

    /* 動作確認用3(キッチンクロス) */
    /*--base-color: rgb(229, 227, 218);*/
    /*--main-color: rgb(234, 198, 180);*/
    /*--text-color: rgb(149, 114, 117);*/
    /*--tag-label-background-color: rgb(132, 157, 116);*/

    /* 動作確認用4(ロココ調インテリア) */
    /*--base-color: rgb(235, 219, 224);*/
    /*--main-color: rgb(194, 81, 102);*/
    /*--text-color: rgb(158, 115, 96);*/
    /*--tag-label-background-color: rgb(216, 167, 103);*/

    /* コンポーネント */
    --app-frame-color: rgb(216, 216, 216);

    --app-button-default-foreground-color: hsl(0, 0%, 10%);
    --app-button-default-background-color: hsl(0, 0%, 100%);
    --app-button-default-border-color: hsl(0, 0%, 60%);
    --app-button-default-disable-foreground-color: hsl(0, 0%, calc(10% + 40%));
    --app-button-default-disable-border-color: hsl(0, 0%, calc(60% + 20%));
    --app-button-default-hover-background-color: hsl(0, 0%, calc(60% + 20%));
    --app-button-default-active-background-color: hsl(0, 0%, calc(60% - 10%));

    --app-button-primary-foreground-color: hsl(0, 0%, 100%);
    --app-button-primary-background-color: hsl(0, 0%, 60%);
    --app-button-primary-border-color: hsl(0, 0%, 60%);
    --app-button-primary-disable-background-color: hsl(0, 0%, calc(60% + 20%));
    --app-button-primary-disable-border-color: hsl(0, 0%, calc(60% + 20%));
    --app-button-primary-hover-background-color: hsl(0, 0%, calc(60% + 10%));
    --app-button-primary-active-background-color: hsl(0, 0%, calc(60% - 20%));

    --app-button-danger-foreground-color: hsl(0, 0%, 100%);
    --app-button-danger-background-color: hsl(0, 100%, 65%);
    --app-button-danger-border-color: hsl(0, 100%, 65%);
    --app-button-danger-disable-background-color: hsl(0, 100%, calc(65% + 20%));
    --app-button-danger-disable-border-color: hsl(0, 100%, calc(65% + 20%));
    --app-button-danger-hover-background-color: hsl(0, 100%, calc(65% + 10%));
    --app-button-danger-active-background-color: hsl(0, 100%, calc(65% - 20%));

    --app-button-text-foreground-color: var(--text-color);
    --app-button-text-disable-color: hsl(0, 0%, 60%);
    --app-button-text-hover-color: hsl(210, 100%, 60%);
    --app-button-text-active-color: hsl(210, 100%, calc(60% - 20%));

    --app-divider-color: rgb(216, 216, 216);
    --app-link-normal-color: var(--text-color);
    --app-link-hover-color: hsl(207, 50%, 50%);
    --app-link-active-color: hsl(207, 50%, calc(50% - 10%));
    --app-modal-mask-color: rgba(0, 0, 0, 0.3);

    --badge-image-count-foreground-color: rgb(216, 216, 216);
    --badge-image-count-background-color: var(--base-color);
    --badge-image-count-border-color: rgb(216, 216, 216);

    --badge-text-foreground-color: rgb(216, 216, 216);
    --badge-text-background-color: var(--base-color);
    --badge-text-border-color: rgb(216, 216, 216);

    --creator-display-icon-selector-drop-zone-foreground-color: hsl(0, 0%, 60%);
    --creator-display-icon-selector-drop-zone-background-color: hsl(0, 0%, 100%);

    --dialog-edit-tag-header-color: rgb(0, 187, 0);
    --dialog-edit-error-color: rgb(255, 0, 0);

    --dialog-input-text-header-color: rgb(66, 185, 131);

    --dialog-ok-cancel-header-color: rgb(66, 185, 131);

    --dialog-set-creator-header-color: rgb(0, 187, 0);

    --image-detail-add-star-color: rgb(155, 155, 155);

    --image-thumbnail-placeholder-foreground-color: hsl(0, 0%, 50%);
    --image-thumbnail-placeholder-background-color: hsl(0, 0%, 83%);

    --lightbox-mask-color: rgba(0, 0, 0, .5);
    --lightbox-navigation-enable-foreground-color: rgb(255, 255, 255);
    --lightbox-navigation-disable-foreground-color: rgb(128, 128, 128);
    --lightbox-navigation-hover-background-color: rgba(255, 255, 255, 0.5);

    --star-count-foreground: rgb(247, 161, 99);
    --star-count-background: rgb(247, 235, 99);

    --search-box-foreground-color: var(--main-color);
    --search-box-background-color: var(--base-color);
    --search-box-button-foreground-color: var(--base-color);
    --search-box-button-background-color: var(--main-color);

    --search-progress-foreground-color: rgba(155, 155, 155, 0.2);

    --search-result-foreground-color: rgba(155, 155, 155, 0.2);

    --tab-list-enable-color: var(--main-color);
    --tab-list-disable-color: rgba(155, 155, 155, 0.2);

    --tag-label-foreground-color: rgb(64, 64, 64);
    --tag-label-background-color: rgb(173, 216, 230);

    --tag-thumbnail-background-color: hsl(195, 53%, 79%);
    --tag-thumbnail-name-foreground-color: rgb(0, 0, 0);
    --tag-thumbnail-name-background-color: rgba(128, 128, 128, 0.8);
    --tag-thumbnail-count-foreground-color: rgb(224, 224, 224);
    --tag-thumbnail-count-background-color: rgba(204, 0, 0, 0.8);

    --the-breadclumb-list-foreground-color: var(--text-color);
    --the-breadclumb-list-background-color: var(--main-color);

    --the-calendar-item-caption-foreground-color: rgb(255, 255, 255);
    --the-calendar-item-caption-shadow-color: rgb(128, 128, 128);
    --the-calendar-not-current-month-color: rgb(211, 211, 211);

    --the-global-navigation-button-enable-color: var(--main-color);
    --the-global-navigation-button-disable-color: rgba(155, 155, 155, 0.2);
    --the-global-navigation-page-item-color: var(--main-color);

    --the-pagination-border-color: var(--main-color);
    --the-pagination-foreground-color: var(--text-color);
    --the-pagination-background-color: var(--base-color);
    --the-pagination-current-foreground-color: rgb(255, 255, 255);
    --the-pagination-current-background-color: rgb(169, 169, 169);
    --the-pagination-hover-background-color: rgb(211, 211, 211);

    --year-month-selector-arrow-foreground-color: rgb(155, 155, 155);
    --year-month-selector-arrow-active-background-color: rgb(211, 211, 211);

    /* ページ */
    --page-download-status-background-color: rgb(248, 249, 250);
    --page-download-status-item-background-color: rgb(255, 255, 255);
    --page-download-status-button-border-color: rgb(216, 216, 216);
    --page-download-status-button-normal-foreground-color: rgb(128, 128, 128);
    --page-download-status-button-normal-background-color: rgb(255, 255, 255);
    --page-download-status-button-normal-hover-foreground-color: rgb(239, 239, 239);
    --page-download-status-button-normal-active-foreground-color: rgb(223, 223, 223);
    --page-download-status-button-alert-foreground-color: rgb(255, 255, 255);
    --page-download-status-button-alert-background-color: rgb(74, 179, 244);
    --page-download-status-button-alert-hover-foreground-color: rgb(52, 170, 243);
    --page-download-status-button-alert-active-foreground-color: rgb(29, 161, 242);
    --page-download-status-button-remove-foreground-color: rgb(216, 216, 216);
    --page-download-status-button-remove-hover-foreground-color: rgb(128, 128, 128);
    --page-download-status-url-color: rgb(51, 103, 214);
    --page-download-status-no-data-foreground-color: rgb(184, 184, 184);
}