Brand Guidelines
The visual language of Padel Holidays Direct — colours, typography, logo usage, and design principles.
Logo
The Padel Holidays Direct logo should always be used with clear space around it. Display on light backgrounds in full colour, or inverted on dark backgrounds.
Clear space
Always keep padding equal to half the logo height on all sides.
No distortion
Never stretch, skew, or add effects like drop shadows to the logo.
Minimum size
Minimum height of 32px for digital use. Never go smaller.
Colour Palette
Three core tones — warm amber, premium gold, and confident teal — paired with a clean dark foundation. Each colour has a specific role in the visual hierarchy.
Primary
#d97706
Main CTAs, primary buttons, key highlights
Primary Light
#f59e0b
Subtle backgrounds, hover fills, badges
Primary Dark
#92400e
Hover states, pressed buttons, emphasis
Gold
#c9a84c
Secondary CTAs, stars, premium accents
Gold Hover
#a8892f
Gold element hover states
Teal
#0d9488
Trust elements, checkmarks, secondary actions
Teal Hover
#0f766e
Teal element hover states
Dark
#0f172a
Hero backgrounds, footer, dark sections
Dark Alt
#1e293b
Cards on dark, subtle elevation
Typography
DM Sans for headings brings a confident, modern feel. Inter for body text ensures excellent readability across all devices and sizes.
Heading Font
DM Sans
Bold, geometric, and confident. Used for all headings and section titles.
Body Font
Inter
Clean, neutral, and highly legible. Used for all body copy, descriptions, and UI text.
H1 — Page Titles
H2 — Section Heads
H3 — Subsections
Body
Caption / Small
Buttons & Interactions
A hierarchy of button styles ensures users always know what action is most important on any page.
Primary CTA
Gold CTA
Teal Outline
Ghost Dark
Text Link
Iconography
Remix Icon (line style) is used throughout the site for UI elements, feature lists, and navigation. Always keep icons at a consistent stroke weight and size.
ri-check-line
ri-star-fill
ri-arrow-right-line
ri-arrow-left-s-line
ri-arrow-right-s-line
ri-menu-line
ri-close-line
ri-arrow-down-s-line
ri-equalizer-line
ri-map-pin-line
ri-phone-line
ri-mail-line
ri-calendar-line
ri-user-line
ri-group-line
ri-flight-takeoff-line
Do's & Don'ts
Quick rules to keep the brand consistent across every touchpoint.
Do
- Use the amber primary for the most important single CTA per page
- Pair gold with premium or secondary actions
- Keep generous whitespace between sections
- Use dark backgrounds for hero sections and CTAs
- Invert the logo to white on dark backgrounds
Don't
- Use blue, purple, or neon colours anywhere on the site
- Place more than one primary CTA button in a single section
- Use shadows on cards or containers
- Display the logo smaller than 32px in digital contexts
- Mix multiple heading fonts in the same section