Style guide

The tokens behind the site: colour, type, spacing and the small set of components every page is built from.

Colour

Ink#000000
Lime#9CE069
Canvas#E6E8DD
Panel#FFFFFF

The canvas stays sage, panels stay white and text stays near-black. Lime is reserved for emphasis: one accent per view, never as a text colour on the canvas.

Typography

Eyebrow label · IBM Plex Mono 11px

Display heading in Inter

Section heading in Inter

Body copy runs at 16 to 17 pixels with 1.6 line height. Headings use a tight tracking of minus three percent, body copy stays neutral.

Buttons

Primary Secondary

Pill radius, 44 pixel height, arrow icon on the right. Every button carries a visible focus ring and a hover shift of two pixels.

Spacing and radius

  • Section rhythm: 112 pixels desktop, 64 pixels on mobile.
  • Container: 1440 pixels outer, 1280 pixels inner, 40 pixel gutter.
  • Card radius: 10 pixels. Panels: 16 pixels. Pills: fully rounded.

Cards

Card label

Standard card

Used for services, beliefs and summary blocks. One border, no shadow, white on hover.

Card label

Linked card

The same card as a link, with a two pixel lift and an arrow affordance.

Get Started

We’re overjoyed to design your next masterpiece

Rendani focuses on what truly matters—user needs, business goals, and long-term growth. Every decision is intentional, ensuring our solutions perform.

Start Your Project