homeassistant-remotecompose card previews

README.md

homeassistant-remotecompose — card previews

Side-by-side comparison of rendered RemoteCompose output against HA reference screenshots (both themes, every implemented card type). See yschimke/homeassistant-remotecompose for the library source.

End-to-end dashboard

A realistic vertical-stack — heading + tiles + entities (with toggles)

• glance — all in one .rc document, side-by-side with the HA capture of the same YAML config.

	Home Assistant	RemoteCompose
Home (light)
Home (dark)

tile

Light theme

variant	Home Assistant	RemoteCompose
temperature sensor
light on
light off
lock locked
cover

Dark theme

variant	Home Assistant	RemoteCompose
temperature sensor
light on

button

Light theme

variant	Home Assistant	RemoteCompose
light on
light off

Dark theme

variant	Home Assistant	RemoteCompose
light on
light off

entity

	Home Assistant	RemoteCompose
temperature (light)
temperature (dark)

entities

	Home Assistant	RemoteCompose
living room (light)
living room (dark)

glance

	Home Assistant	RemoteCompose
overview (light)
overview (dark)

markdown

	Home Assistant	RemoteCompose
notes (light)
notes (dark)

State variants (single document, binding-driven)

Each tile emits one .rc document whose accent + chip flip based on a named RemoteBoolean that the player updates live — same bytes, three rendered states.

Light entity

on	off	unavailable

Cover entity

closed	open	opening

Lock entity

locked	unlocked	locking

Layout-only cards (no HA reference — wrapper visual)

Card	Light	Dark
vertical-stack
horizontal-stack
grid
heading
gauge (unsupported placeholder)

Known gaps

• Chip shape. Tile icon chip renders as a rounded rectangle instead of a full circle despite .clip(RemoteCircleShape) — looks like an alpha08 player clip bug, not a composable bug.
• Icons differ slightly in style. Compose Material Symbols vs HA's MDI — same meaning, different geometry. Accepted.
• ColorTheme. Today we render one document per theme. When the creation-side DSL for androidx.compose.remote.core.operations.ColorTheme is public we collapse to a single document that switches palettes at playback.

Reproducing

git clone https://github.com/yschimke/homeassistant-remotecompose
cd homeassistant-remotecompose

scripts/render-previews.sh      # our PNGs
scripts/stage-gist.sh           # stage side-by-side under /tmp/ha-rc-gist
scripts/publish-gist.sh         # push to the gist

rc_button_states_off_dark.png

rc_button_states_off_light.png

rc_button_states_on_dark.png

rc_button_states_on_light.png

rc_dashboard_home_dark.png

rc_dashboard_home_light.png

rc_entities_living_room_dark.png

rc_entities_living_room_light.png

rc_entity_temperature_sensor_dark.png

rc_entity_temperature_sensor_light.png

rc_glance_overview_dark.png

rc_glance_overview_light.png

rc_grid_dark.png

rc_grid_light.png

rc_heading_title_dark.png

rc_heading_title_light.png

rc_horizontalstack_dark.png

rc_horizontalstack_light.png

rc_markdown_notes_dark.png

rc_markdown_notes_light.png

rc_tile_cover_states_closed.png

rc_tile_cover_states_open.png

rc_tile_cover_states_opening.png

rc_tile_light_on_dark.png

rc_tile_light_on_light.png

rc_tile_light_states_off.png

rc_tile_light_states_on.png

rc_tile_light_states_unavailable.png

rc_tile_lock_states_locked.png

rc_tile_lock_states_locking.png

rc_tile_lock_states_unlocked.png

rc_tile_temperature_sensor_dark.png

rc_tile_temperature_sensor_light.png

rc_unsupported_dark.png

rc_unsupported_light.png

rc_verticalstack_dark.png

rc_verticalstack_light.png

ref_button_light_off_dark.png

ref_button_light_off_light.png

ref_button_light_on_dark.png

ref_button_light_on_light.png

ref_dashboard_home_dark.png

ref_dashboard_home_light.png

ref_entities_living_room_dark.png

ref_entities_living_room_light.png

ref_entity_light_on_dark.png

ref_entity_light_on_light.png

ref_entity_temperature_sensor_dark.png

ref_entity_temperature_sensor_light.png

ref_glance_overview_dark.png

ref_glance_overview_light.png

ref_markdown_notes_dark.png

ref_markdown_notes_light.png

ref_tile_cover_dark.png

ref_tile_cover_light.png

ref_tile_light_off_dark.png

ref_tile_light_off_light.png

ref_tile_light_on_dark.png

ref_tile_light_on_light.png

ref_tile_lock_locked_dark.png

ref_tile_lock_locked_light.png

ref_tile_temperature_sensor_dark.png

ref_tile_temperature_sensor_light.png