Theme Studio

Remix

Ändra ett värde och se huset förändras. Validatorn kör vid varje tangenttryck — samma regler som granskar en pull request, så inget här kan passera en kontroll som CI kommer att fälla.

Start from

Identity

Name

lowercase letters, digits and hyphens

Author

Description

Surfaces

Huset bakom glaset. Alva suddar det som ligger bakom en panel, så ytfärger förväntas bära alfa — en opak yta är tillåten och ser bara platt ut.

bg-base

The page behind everything.

100%

bg-surface

A panel. Usually translucent.

72%

bg-surface-2

A panel resting on a panel.

80%

bg-elevated

Dialogs and sheets, which must stay readable over anything.

92%

glass-highlight

The lit top edge of a glass panel.

card-gradient

Skenet över ett kort. ”none” är giltigt.

Accent & form

radius · 18px

Validator

Temat passerar alla kontroller.

[theme]
id = "remix"
name = "Remix"
author = "unknown"

[tokens]
bg-base = "#02070b"
bg-surface = "rgba(8, 20, 30, 0.72)"
bg-surface-2 = "rgba(12, 27, 39, 0.8)"
bg-elevated = "rgba(8, 19, 29, 0.92)"
glass-highlight = "rgba(255, 255, 255, 0.07)"
card-gradient = "linear-gradient(180deg, rgba(126, 200, 240, 0.055) 0%, rgba(126, 200, 240, 0) 42%)"
accent = "#7ec8f0"
text = "#e8eef6"
radius = "18px"

10:56

DEMO

God morgon

Fredag 14 augusti

HUSET

Säkert

HEMMA

Mathias

STRÖM

Normal

Ansluten

EV charging 15:54–19:54

16.90 kr/kWh mot 27.50 nu

−10.60 kr

Huset

Tryck på ett rum

3D · Plan

Kök

Vardagsrum

Sovrum

Kontor

Hall

Badrum

Terrass

Garage

SCENER

God morgonMysFilmAllt av

SNABBÅTKOMST

Belysning

0 lampor på

Kameror

0 av 4

Apple TV

Gardiner

2 öppna

Larm

Så fungerar det

Tre lager mellan en färg och hela huset.

Tokens

Ett tema är bara värden — ytor, accent, radie, glas. Inga komponenter kopieras.

Validator

Samma regler som i CI körs medan du skriver, så ett tema aldrig blir oläsbart.

Publicering

Spara temat i hushållet och välj var det gäller: en panel, en person eller hela huset.

Ett hus. Hur många utseenden du vill.

Studio följer med Alva. Prova temamotorn i demon och se hur snabbt hela gränssnittet byter skepnad.

Öppna live demo