DESIGN BY END — INTERNAL REFERENCE

Style Guide

Brand colours, typography, components and UI patterns for the Design by END website.

01 — COLOURS

Colour Palette

Black

#0A0A0A

Primary background, headings on light BG

Lime Accent

#C8F135

CTAs, buttons, highlights, hover states

Off White

#F5F4F0

Page backgrounds, light section fills

White

#FFFFFF

Cards, panels, clean surfaces

Muted Grey

#8A8A8A

Supporting text, labels, captions

02 — TYPOGRAPHY

Type Scale

H1 — 56px / 700

Heading One

H2 — 44px / 700

Heading Two

H3 — 32px / 700

Heading Three

H4 — 24px / 600

Heading Four

Body — 16px / 400

Body copy. For growing businesses ready to move beyond DIY. Websites that feel professional, work smoothly behind the scenes, and are easy to manage.

Small — 14px / 400

Small body / supporting text. Used for captions, footnotes and secondary information.

Label — 11px / 500

SECTION LABEL / EYEBROW TEXT

03 — BUTTONS

Button Variants

Primary Button

Lime — Primary CTA

Dark Button

Black — Secondary CTA

Outline Button

Outline — Tertiary

Ghost Button

Ghost — Low emphasis

04 — FORM ELEMENTS

Forms & Inputs

Default Input

Full Name

Message

05 — SPACING

Spacing Scale

4px

8px

16px

24px

32px

48px

64px

80px

06 — BORDER RADIUS

Border Radius

0px Sharp

2px Subtle

4px Default

8px Cards

9999px Pill / Tag