Hotel Emerald · System Design
Design System
Unify visual rules and page structure into one reusable system.
Step 1
Reference The Visual Direction
Run `claude --chrome`, then use `/clone-website https://halcyonhouse.com.au/` to clone the primary visual reference. Use `https://gregori-template.webflow.io/` as the secondary structure reference.
claude --chrome /clone-website https://halcyonhouse.com.au/
Step 2
Apply The Hotel Emerald Palette
Clone the Halcyon House feel first, then replace the palette with Hotel Emerald brand colors: `--emerald: #00573D` and `--gold: #B1975E`.
Step 3
Lock The Design System
Generate a design-system document that locks the brand rules for colors, typography, layout rhythm, imagery, and booking-focused UI components.
/teach-impeccable
Next Workflow
Continue to Page Structure
Once the visual direction and brand rules are fixed, move to the next workflow to turn the system into page-level structure and section planning.
Go to Page Structure