色を変更する方法

VitePressのデフォルトテーマの場合テーマカラーはネイビーになりますが、これをグリーンに変更するには以下のようにします。 .vitepress/theme/index.tsを作成します。

import DefaultTheme from 'vitepress/theme'
import './custom.css'

export default DefaultTheme

色の指定はここでimportすることにしたcustom.cssで行います。

/* .vitepress/theme/custom.css */
:root {
    --vp-c-brand-1: var(--vp-c-green-1);
    --vp-c-brand-2: var(--vp-c-green-2);
    --vp-c-brand-3: var(--vp-c-green-3);
    --vp-c-brand-soft: var(--vp-c-green-soft);
  }