nuxt.config.jsのVuetify > optionsにcustomProperties: true
を追記する。
- nuxt.congif.js
... vuetify: { .... options: { customProperties: true } }, }, ...
CSSに、var(--v-primary-base)
のように記述すれば、変数を利用できる。
background: var(--v-primary-base);
※単一ファイルコンポーネント(style内、template内にインライン指定とか)でも、assetsフォルダとかに入れる個別のscssファイル内のいずれからも呼び出せる。
--v-primary-base以外にどんな変数があるの?ってcolor変数の一覧を見たい時は、
Google Chromeのデベロッパーツールで、<body>
タグを確認すれば、どんな色かも併せてチェックできるので便利。