Display

ThemeColorPreview.kt

package com.glureau

import android.content.res.Configuration.UI_MODE_NIGHT_NO
import android.content.res.Configuration.UI_MODE_NIGHT_YES
import androidx.compose.foundation.ExperimentalFoundationApi
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.aspectRatio
import androidx.compose.foundation.lazy.GridCells
import androidx.compose.foundation.lazy.LazyVerticalGrid
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.luminance
import androidx.compose.ui.tooling.preview.Preview

@OptIn(ExperimentalFoundationApi::class) // Required by LazyVerticalGrid (Jetpack Compose 1.1.0-alpha03)
@Composable
@Preview(name="Dark Mode", uiMode = UI_MODE_NIGHT_YES)
@Preview(name="Light Mode", uiMode = UI_MODE_NIGHT_NO)
fun ThemeColorPreview() {
    AppTheme { // Replace here with your theme
        val colors = listOf(
            "primary" to MaterialTheme.colors.primary,
            "primaryVariant" to MaterialTheme.colors.primaryVariant,
            "secondary" to MaterialTheme.colors.secondary,
            "secondaryVariant" to MaterialTheme.colors.secondaryVariant,
            "background" to MaterialTheme.colors.background,
            "surface" to MaterialTheme.colors.surface,
            "error" to MaterialTheme.colors.error,
            "onPrimary" to MaterialTheme.colors.onPrimary,
            "onSecondary" to MaterialTheme.colors.onSecondary,
            "onBackground" to MaterialTheme.colors.onBackground,
            "onSurface" to MaterialTheme.colors.onSurface,
            "onError" to MaterialTheme.colors.onError,
        )
        LazyVerticalGrid(cells = GridCells.Fixed(4)) {
            colors.forEach { (name, color) ->
                item {
                    Text(
                        text = if (isSystemInDarkTheme()) "$name (dark)" else name,
                        color = textColorForBackground(color),
                        modifier = Modifier
                            .aspectRatio(1f)
                            .background(color)
                    )
                }
            }
        }
    }
}

fun textColorForBackground(color: Color) =
    if (color.luminance() > 0.5) Color.Black else Color.White

Also big up on https://github.com/airbnb/Showkase project, if you prefer to have all previews running on your device in real conditions.