Design system

Ten colour worlds, ten type pairings, one token system.

Every template declares tokens; a business's brand colours override them through CSS variables. Contrast is checked and corrected automatically, so any brand colour stays readable.

Palettes & type

• Hotels

  Sunset over the Mara

  Fresh bouquets delivered across Nairobi before lunch, paid for with M-PESA.

  Order nowDetailsKijaniFresh
  #f6f1e7

  #fffdf8

  #1b1916

  #1c1a17

  #b8925a

  #12100e

  Type

  Cormorant Garamond Variable
  Jost Variable

  • ink on paper15.6
  • muted on paper4.9
  • brand on paper15.4
  • on-primary on primary17.4
  • on-accent on accent6.6

• Restaurants

  Sunset over the Mara

  Fresh bouquets delivered across Nairobi before lunch, paid for with M-PESA.

  Order nowDetailsKijaniFresh
  #fff6ea

  #fffdf8

  #2c1810

  #b83a1e

  #f2a413

  #2a140c

  Type

  Fraunces Variable
  DM Sans Variable

  • ink on paper15.8
  • muted on paper4.9
  • brand on paper5.4
  • on-primary on primary5.7
  • on-accent on accent9.1

• Florists

  Sunset over the Mara

  Fresh bouquets delivered across Nairobi before lunch, paid for with M-PESA.

  Order nowDetailsKijaniFresh
  #fff7f6

  #ffffff

  #3b2230

  #a23b63

  #f0b6c4

  #451a33

  Type

  Playfair Display Variable
  Quicksand Variable

  • ink on paper13.6
  • muted on paper4.9
  • brand on paper6.0
  • on-primary on primary6.3
  • on-accent on accent11.0

• Agrovets

  Sunset over the Mara

  Fresh bouquets delivered across Nairobi before lunch, paid for with M-PESA.

  Order nowDetailsKFKijani Fresh
  #f5f2e6

  #fffef9

  #1f2a1b

  #2e6a2f

  #d68a05

  #173318

  Type

  Bitter Variable
  Source Sans 3 Variable

  • ink on paper13.3
  • muted on paper4.9
  • brand on paper5.8
  • on-primary on primary6.5
  • on-accent on accent6.7

• Hardware

  Sunset over the Mara

  Fresh bouquets delivered across Nairobi before lunch, paid for with M-PESA.

  Order nowDetailsKFKijani Fresh
  #f0f0ee

  #ffffff

  #101010

  #ffc400

  #e8470f

  #111111

  Type

  Barlow Condensed
  Barlow

  • ink on paper16.7
  • muted on paper4.8
  • brand on paper16.7
  • on-primary on primary11.8
  • on-accent on accent4.8

• Supermarkets

  Sunset over the Mara

  Fresh bouquets delivered across Nairobi before lunch, paid for with M-PESA.

  Order nowDetailsKFKijani Fresh
  #f7faff

  #ffffff

  #0f1b33

  #1550d6

  #ffd12a

  #0c2a74

  Type

  Baloo 2 Variable
  Nunito Sans Variable

  • ink on paper16.4
  • muted on paper5.0
  • brand on paper6.4
  • on-primary on primary6.7
  • on-accent on accent13.0

• Tours & Safari

  Sunset over the Mara

  Fresh bouquets delivered across Nairobi before lunch, paid for with M-PESA.

  Order nowDetailsKijaniFresh
  #0e1512

  #17211c

  #f4efe3

  #e98a2c

  #46c2a1

  #08100c

  Type

  Syne Variable
  Manrope Variable

  • ink on paper16.1
  • muted on paper7.8
  • brand on paper7.2
  • on-primary on primary7.3
  • on-accent on accent8.5

• Beauty & Spa

  Sunset over the Mara

  Fresh bouquets delivered across Nairobi before lunch, paid for with M-PESA.

  Order nowDetailsKijaniFresh
  #f9f6f1

  #ffffff

  #2b2a28

  #46766d

  #e6c4b4

  #223a35

  Type

  Gilda Display
  Hanken Grotesk Variable

  • ink on paper13.3
  • muted on paper4.8
  • brand on paper4.8
  • on-primary on primary5.2
  • on-accent on accent11.6

• Bookshops

  Sunset over the Mara

  Fresh bouquets delivered across Nairobi before lunch, paid for with M-PESA.

  Order nowDetailsKijaniFresh
  #f4ecd9

  #fbf6ea

  #2a2118

  #1f3252

  #c4902a

  #16233b

  Type

  Newsreader Variable
  Work Sans Variable

  • ink on paper13.4
  • muted on paper5.0
  • brand on paper10.9
  • on-primary on primary12.8
  • on-accent on accent6.6

• General

  Sunset over the Mara

  Fresh bouquets delivered across Nairobi before lunch, paid for with M-PESA.

  Order nowDetailsKFKijani Fresh
  #f5f7fb

  #ffffff

  #12152e

  #3a3fb0

  #0fb5c9

  #12143a

  Type

  Plus Jakarta Sans Variable
  Inter Variable

  • ink on paper16.7
  • muted on paper4.7
  • brand on paper7.8
  • on-primary on primary8.3
  • on-accent on accent7.6

Brand override

A business supplies one or two colours; the rest re-derives: text colour on fills, tints, dark sections, and an accessible text variant of the brand colour.

• Category default

  Order tonight

  Order nowReserve

  Dark band

  Buttons flip to the accent here.

  Book a table

• Brand: maroon #7b1e3a

  Order tonight

  Order nowReserve

  Dark band

  Buttons flip to the accent here.

  Book a table

• Brand: pale yellow #f5e663 (low contrast)

  Order tonight

  Order nowReserve

  Dark band

  Buttons flip to the accent here.

  Book a table

Generated wordmarks

No logo supplied? A clean wordmark is typeset from the business name in the template's display face.

• SerenaRidge Hotelserif-caps
• SerenaRidge Hotelserif-italic
• SRSerena Ridge Hotelbold-block
• SRSerena Ridge Hotelrounded
• SerenaRidge Hotelstacked
• SRSerena Ridge Hotelmono-badge

Kenyan payment cues