---
title: "ダークモード"
description: "Adaptyのフローにダークモードを設定して、ユーザー体験を向上させる方法を説明します。"
---

Adapty のフローはダークモードをデフォルトでサポートしています。カラースタイルにはライトとダークの2つのカラーが設定されており、スタイルを要素に適用すると、デバイスの現在のモードに応じて適切な値が自動的に使用されます。Adapty にはあらかじめ設定済みのカラースタイルが用意されており、独自のスタイルを作成することもできます。

## カラースタイルを設定する \{#configure-color-styles\}

各**カラースタイル**では、ライトとダークのカラーをそれぞれ定義します。要素に名前付きスタイルを適用すると、2つのカラーが自動的に切り替わります。

カラースタイルは左側の **Style** > **Colors** で管理できます。

カラースタイルを追加するには：

1. **Style** > **Colors** で **Create style** をクリックします。
2. ライトとダークのカラーをそれぞれ選択します。

スタイルの名前を変更するには、スタイルの横にある **⋮** をクリックして **Rename** を選択します。

## ステータスバーのテーマを設定する \{#set-the-status-bar-theme\}

**Screen settings** パネルで **Status bar** が有効になっている場合、テーマを個別に設定できます。**Status bar theme** オプションから **Light**、**Dark**、または **Auto** を選択してください。

## ライト＆ダークモードをプレビューする \{#preview-light--dark-modes\}

フローが各モードでどのように表示されるかを確認するには、プレビューエリア下部の太陽/月アイコンのトグルを使用します。

## ダークモードを削除する \{#remove-dark-mode\}

ダークモードのサポートを完全に削除するには、**Style** > **Colors** パネルで **⋮** > **Delete dark theme** をクリックします。