Jupitair HVAC Logo
Free Quote
Menu
Residential Services
AC Repair Emergency AC Repair AC Installation AC Maintenance View All Residential →
Commercial Services
Office HVAC Restaurant HVAC Retail HVAC RTU Replacement View All Commercial →
All Service Areas
Frisco Plano McKinney Allen Prosper The Colony Little Elm Addison
About Contact Resources
Call (940) 390-5676

Jupitair HVAC Style Guide

Design system and brand guidelines for consistent presentation

Brand Colors

Primary Blue

#2563eb

Professional HVAC services, cooling systems

Emergency Red

#dc2626

Emergency services, urgent CTAs

Secondary Orange

#ea580c

Heating services, phone numbers

Success Green

#16a34a

Maintenance, success messages

Typography

H1 Heading

4xl/5xl, font-bold - Page titles

H2 Heading

2xl/3xl, font-bold - Section headers

H3 Heading

xl/2xl, font-semibold - Subsections

H4 Heading

lg, font-semibold - Component titles

Body text paragraph using base size

base/sm - Body text and small text

Button Components

Primary Buttons

Emergency Buttons

Secondary & Outline

Card Components

Default Card

Standard card with white background and subtle shadow. Used for content sections and form containers.

Bordered Card

Card with border styling. Used for service listings and informational content blocks.

Elevated Card

Card with enhanced shadow. Used for interactive elements and prominent content sections.

Gradient Card

Special gradient background card. Used for featured content and call-to-action sections.

Data Display Components

Years Experience

15+

Emergency Service

24/7

Customer Rating

5.0★

Service Guarantee

100%

Usage Guidelines

Brand Voice

  • Professional: Expert HVAC knowledge and technical expertise
  • Reliable: Dependable service you can trust
  • Local: North Texas community focus
  • Accessible: Clear communication, no jargon
  • Emergency-ready: Always available when needed

Key Messages

  • Phone: (940) 390-5676 prominently displayed
  • Service Area: 8 North Texas cities
  • Emergency: 24/7 availability with 2-hour response
  • Experience: 15+ years serving North Texas
  • Credentials: Licensed, insured, NATE certified

Color Usage

  • Primary Blue: Main CTAs, professional services
  • Emergency Red: 24/7 service, urgent messaging
  • Secondary Orange: Phone numbers, heating services
  • Success Green: Maintenance, positive messaging
  • Gray Scale: Body text, backgrounds, borders

Component Usage

  • Primary Buttons: Main actions, service requests
  • Emergency Buttons: 24/7 service, phone CTAs
  • Elevated Cards: Service listings, interactive content
  • Gradient Cards: Featured content, special offers
  • Data Cards: Statistics, business metrics

Responsive Breakpoints

Breakpoint Min Width Container Usage
sm 640px 640px Large phones, small tablets
md 768px 768px Tablets
lg 1024px 1024px Small desktops
xl 1280px 1280px Large desktops
2xl 1536px 1536px Extra large screens