The colours, type, shapes and pictures of Orbi Studio in one place.
Brand
Orbi StudioOrbi StudioHealth & Clinic - Calm, clean and trustworthy: cool blues and greens, care and wellbeing in every picture.
Palette Bright Cyan 2 · Neo-Brutalism style · pictures: Line waves with health & clinic subjects · fonts Syne and Space Grotesk
Colours
Every colour is a token in assets/css/theme.css (--wt-primary ...). The contrast of the text colours is shown against the page; WCAG AA needs 4.5:1 for text.
Light mode
Dark mode
Type
Syne
Headings
Space Grotesk
Text, buttons and forms (Google Fonts)
Physio that gets you moving again
Care built around your day
The small habits that make a big difference
Video consultations run from 8 am to 8 pm, and any prescription is sent straight to the pharmacy you choose.
Same-day appointments are available for urgent needs on weekdays. Modern equipment means faster diagnoses and more comfortable treatment. Start in minutes and get help from a real person whenever you need it.
We keep things simple, so you can focus on what matters to you.
Corners and depth
--wt-shadow--wt-shadow-lgComponents
Pictures
Line waves in the template colours, with health & clinic subjects. Every product picture shows its product. Replace them with your own photos of the same size (see PHOTOS.md for the photos of the live demo).
Design files
design-tokens/tokens.json- every token in the W3C Design Tokens format: in Figma, install the Tokens Studio plugin and load the file; Style Dictionary turns it into code for other platforms.design-tokens/style-guide.svg- this page as a board: drag it into Figma, Sketch or Illustrator and every swatch, text and shape stays editable.design-tokens/tokens.css- the same values as CSS variables for other projects in the brand.