# TailwindCSS のダークモードでページ読み込み時に一瞬ライトモードで表示されてしまうときの対応法
## TL;DR
`` タグ内にインラインでダークモードか判定するスクリプトを記述するようにしましょう。
```html:index.html
```
## 一瞬ライトモードで表示されてしまう現象
一瞬ライトモードで表示されてしまう現象とは、以下のような状態です。
原因としては、スクリプトでダークモードの判定を行うより先に初回レンダリングが実行されてしまうためです。これはダークモードの判定を行うスクリプトを `useEffect` や `onMount` のようなフック内で記述していると起こります。
```html:+layout.svelte
````
ダークモードかどうかの判定は基本的にユーザーの OS の設定や LocalStorage に保存してある値を利用するので、ユーザーごとに異なります。そのため、ダークモードでプレレンダリングしておくなどの手段を取ることができません。
## 解決方法
単純な解決方法としては、最初のレンダリングが開始されるより前にスクリプトでダークモードの判定が終わっていればよいわけです。`
```