{"version":"1.0","type":"rich","title":"alt","description":"A collection of sprite-based house icons demonstrates how CSS pseudo-elements and background positioning can create interactive states. Each house uses the `.house` class with `:before` and `:after` pseudo-elements, layering two background images from a single sprite sheet to render the house and its shadow. Hovering enlarges the element via a `transition`, while the `disabled` state reduces opacity. Variants like `.alt` shift the background horizontally and `.mirrored` applies `transform:scaleX(-1)` to flip the icon. The examples are plain HTML divs styled with plain CSS, with no JavaScript libraries involved.","provider_name":"VizHub AI Studio","provider_url":"https://next.vizhub.com","html":"<iframe src=\"https://next.vizhub.com/viz/gist-1951426?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"1\"></iframe>","width":960,"height":500,"cache_age":3600}