kuito.
Começar

appearance

namespace
A tradução desta página não existe ou está desatualizada, por isso é mostrada em inglês. Ler em inglês

Read the system color scheme and font scale. Use these signals when JavaScript behavior must follow appearance; use CSS media queries for most visual styling.

Read appearance preferences

tsx
import { Text, watch, appearance } from 'kuito';

appearance.colorScheme.value; // 'light' | 'dark' | null
appearance.fontScale.value; // 1 by default

// In a component, a read in JSX or a watch follows the platform.
<Text>{appearance.colorScheme.value === 'dark' ? 'Night' : 'Day'}</Text>;
watch(appearance.fontScale, (scale) => console.log(scale));

Behavior and limits

appearance.colorScheme and appearance.fontScale are read-only signals. Read them inside JSX or watch callbacks to follow changes. Font scaling is already applied by native text; do not multiply every font size again. Use @media (prefers-color-scheme: dark) for theme tokens and rules.

Continue

Read Styles for the related workflow. The API reference lists every method, option, event and return type.

Referência

Exportações 4

Métodos, constantes e tipos expostos por este namespace nativo.

typeColorSchemeNameThe user's color scheme, 'light' or 'dark', as appearance.colorScheme reports it.typeAppearancePreferencesThe user's display preferences together, for tests and code that need both at once.valuecolorSchemeCSS's prefers-color-scheme; null when the platform has no preference.valuefontScaleThe text size multiplier the user chose: 1 by default.
Gerado a partir das declarações TypeScript públicas: assinaturas, props e predefinições vêm da fonte verificada, as descrições da sua JSDoc. Nenhuma predefinição é inventada.