Skip to main content
Request a Consultation

Internal reference

Design system

Every token and component in the Great Homecare theme, rendered by the same code the live pages use. Check new work against all three surfaces before shipping it.

Colour

Primitives. Components must never reference these directly — use the semantic tokens (--ghc-color-text, --ghc-color-accent) so a surface can re-map them.

  • 16.04:1
    --ghc-navy-900 #0A1F38 Deepest navy — footer
  • 14.08:1
    --ghc-navy-800 #0F2A47 PRIMARY — headings, bands
  • 10.72:1
    --ghc-navy-700 #1B3D63 Links, hover
  • 7.56:1
    --ghc-navy-600 #2C5480 Muted text on light
  • 1.17:1
    --ghc-navy-100 #E3EAF2 Muted text on navy
  • 5.70:1
    --ghc-gold-700 #805F13 Only gold legal as text
  • 1.85:1
    --ghc-gold-500 #DCB847 Accent — decorative on light
  • 1.25:1
    --ghc-gold-200 #F0E2B8 Soft wash, backgrounds
  • 1.00:1
    --ghc-cream-50 #FDFBF6 Page background
  • 1.08:1
    --ghc-cream-100 #F8F2E7 Soft sections
  • 1.20:1
    --ghc-cream-200 #EFE6D6 Decorative hairlines
  • 3.60:1
    --ghc-warm-500 #8C8378 Form field borders
  • 13.78:1
    --ghc-ink #2E2A25 Body copy
  • 6.14:1
    --ghc-success-600 #2F6B45 Form success
  • 6.32:1
    --ghc-error-600 #B3261E Form error

Contrast

Computed live from the palette above. The last row is the one to remember: gold-500 on cream fails both text and non-text thresholds, so on light surfaces it is decoration only — a button background or a divider, never a colour that carries meaning.

Sample Pairing Ratio Needs Use
Sample ink on cream-50 13.78:1 4.5:1 PASS
Body copy on page background
Sample navy-800 on cream-50 14.08:1 4.5:1 PASS
Headings on page background
Sample navy-700 on cream-50 10.72:1 4.5:1 PASS
Links on page background
Sample gold-700 on cream-50 5.70:1 4.5:1 PASS
Accent text and meaningful icons
Sample navy-800 on gold-500 7.62:1 4.5:1 PASS
Primary button label on gold
Sample cream-50 on navy-800 14.08:1 4.5:1 PASS
Body copy on a navy band
Sample gold-500 on navy-800 7.62:1 4.5:1 PASS
Gold accent on a navy band
Sample warm-500 on cream-50 3.60:1 3:1 PASS
Form field border (non-text UI)
Sample error-600 on cream-50 6.32:1 4.5:1 PASS
Form error message
Sample gold-500 on cream-50 1.85:1 4.5:1 DECORATIVE ONLY
Accent gold as text on light

Typography

Fraunces for headings, Nunito Sans for body. Every size is fluid — resize the window to see them move. Body resolves to 16px on a phone and 18px on desktop. Weight never drops below 400 for body copy.

--ghc-text-5xl Display / hero
--ghc-text-4xl H1
--ghc-text-3xl H2
--ghc-text-2xl H3
--ghc-text-xl H4 / card title
--ghc-text-lg Lede
--ghc-text-md Large body
--ghc-text-base Body — 16px mobile, 18px desktop
--ghc-text-sm Meta, captions
--ghc-text-xs Fine print
Prose

Support that fits around daily life

Our caregivers support daily routines with warmth, patience and deep respect. Care is arranged around the preferences that already work for your family, at a pace that suits the person receiving it.

What that includes

  • Assistance with washing, dressing and daily routines
  • Companionship and shared activities
  • Light housekeeping and meal preparation
Care given with warmth, patience and deep respect.

Space

One ramp for everything. Section rhythm is a separate token (--ghc-section-y) owned by .ghc-section — a component must never set page-level vertical padding of its own.

--ghc-space-3xs
--ghc-space-2xs
--ghc-space-xs
--ghc-space-sm
--ghc-space-md
--ghc-space-lg
--ghc-space-xl
--ghc-space-2xl
--ghc-space-3xl

Surfaces

The same components on all three surfaces. Nothing below has an inverse variant — the surface class re-maps the semantic tokens and every component follows. If a new component looks wrong on navy, fix its token usage rather than adding a modifier.

.ghc-surface-page

Eyebrow

A heading on this surface

Body copy, with a link inside it.

Primary Secondary Text link
.ghc-surface-soft

Eyebrow

A heading on this surface

Body copy, with a link inside it.

Primary Secondary Text link
.ghc-surface-inverse

Eyebrow

A heading on this surface

Body copy, with a link inside it.

Primary Secondary Text link

Buttons

All variants clear the 44px minimum tap target. Tab to them to check the focus ring.

Request a Consultation Large Secondary With icon Text
ghc_component( 'button', array( 'label' => ghc_brand( 'cta.primary_label' ), 'url' => home_url( '/contact/' ), 'variant' => 'primary', 'size' => 'lg', ) );

Cards

Personal care

Respectful assistance with washing, dressing and daily routines, always at a comfortable pace.

Companionship

Conversation, shared activities and a familiar, friendly presence through the day.

ghc_component( 'card-service', array( 'title' => 'Personal care', 'text' => 'Respectful assistance with daily routines.', 'icon' => 'heart-hands', 'url' => home_url( '/services/#personal-care' ), ) );

Trust strip

Only claims the client has confirmed in writing belong here. Do not add a fifth point without written confirmation.

  • Insured and bonded
  • Screened caregivers
  • 24/7 care availability
  • Serving Toronto and the GTA

Steps

  1. 1 Step 1 of 3

    Request a consultation

    No cost and no obligation.

  2. 2 Step 2 of 3

    Discuss needs

    We listen to routines and preferences.

  3. 3 Step 3 of 3

    Match with a caregiver

    Suited to the person and the schedule.

Journey

The About page’s presentation of the four steps. The line draws itself when the band scrolls into view, so on this page it is already drawn.

  1. Step 1 of 4

    Request a consultation

    No cost and no obligation.

  2. Step 2 of 4

    Discuss what matters

    We listen to routines and preferences.

  3. Step 3 of 4

    Match with a caregiver

    Suited to the person and the schedule.

  4. Step 4 of 4

    Begin care at home

    We check in as care settles.

  1. Step 1 of 4

    Request a consultation

    No cost and no obligation.

  2. Step 2 of 4

    Discuss what matters

    We listen to routines and preferences.

  3. Step 3 of 4

    Match with a caregiver

    Suited to the person and the schedule.

  4. Step 4 of 4

    Begin care at home

    We check in as care settles.

Process timeline

The Home page’s presentation of the four steps: photograph, numbered badge and step, down a line that draws itself as you scroll. Below 48rem the badges and the line go and each row stacks. Titles are written to one line and descriptions to three — check both here before changing any of that copy.

  1. Two people sitting and reading together in a bright living room
    Step 1 of 2

    Request a consultation

    Call us or send a message. There is no cost and no obligation, and nothing is committed by asking what care could look like.

  2. Step 2 of 2

    Discuss what matters

    We listen to the daily routines, the preferences and the small details that make a day go well for the person receiving care.

  1. Two people sitting and reading together in a bright living room
    Step 1 of 2

    Request a consultation

    Call us or send a message. There is no cost and no obligation, and nothing is committed by asking what care could look like.

  2. Step 2 of 2

    Discuss what matters

    We listen to the daily routines, the preferences and the small details that make a day go well for the person receiving care.

  1. Two people sitting and reading together in a bright living room
    Step 1 of 2

    Request a consultation

    Call us or send a message. There is no cost and no obligation, and nothing is committed by asking what care could look like.

  2. Step 2 of 2

    Discuss what matters

    We listen to the daily routines, the preferences and the small details that make a day go well for the person receiving care.

Statement

Two renderings of the client-approved differentiator statement, both verbatim from ghc_brand(). The cards are what About and Testimonials use; the panels are the Home page’s. Neither may be paraphrased, trimmed or reordered — including the approved “honor” spelling and the ® on the tagline — and neither puts a heading over a sentence, because a heading is a claim about what that sentence says.

What makes Great Homecare Services different is our commitment to seeing the whole person.

We meet every client's needs with professionalism, but we also honor their preferences, routines, and individuality.

Our caregivers provide care with warmth, patience, and deep respect, ensuring every client feels valued, understood, and supported.

This is why families trust us: our care truly comes From Our Heart to Yours®.

The panels, on all three surfaces: a photograph in the middle with a sentence either side of it, two above and two below. The photograph takes the height of the panels beside it rather than a ratio, so the middle column is only as tall as the words make it. Below 64rem it moves to the top and the panels become a two-by-two; below 48rem everything stacks.

What makes Great Homecare Services different is our commitment to seeing the whole person.

We meet every client's needs with professionalism, but we also honor their preferences, routines, and individuality.

Our caregivers provide care with warmth, patience, and deep respect, ensuring every client feels valued, understood, and supported.

This is why families trust us: our care truly comes From Our Heart to Yours®.

What makes Great Homecare Services different is our commitment to seeing the whole person.

We meet every client's needs with professionalism, but we also honor their preferences, routines, and individuality.

An older woman seated at home with a younger woman’s arms around her shoulders, both smiling

Our caregivers provide care with warmth, patience, and deep respect, ensuring every client feels valued, understood, and supported.

This is why families trust us: our care truly comes From Our Heart to Yours®.

What makes Great Homecare Services different is our commitment to seeing the whole person.

We meet every client's needs with professionalism, but we also honor their preferences, routines, and individuality.

Our caregivers provide care with warmth, patience, and deep respect, ensuring every client feels valued, understood, and supported.

This is why families trust us: our care truly comes From Our Heart to Yours®.

Quotes

Attribution must be a real, consented name. Never pass an invented name, an initial or “A happy client” — if there is no consented attribution, there is no testimonial to publish.

What makes Great Homecare Services different is our commitment to seeing the whole person. We meet every client's needs with professionalism, but we also honor their preferences, routines, and individuality. Our caregivers provide care with warmth, patience, and deep respect, ensuring every client feels valued, understood, and supported. This is why families trust us: our care truly comes From Our Heart to Yours®.

Care given with warmth, patience and deep respect.

Accordion

Native <details>/<summary> — keyboard support and state announcement come from the browser. No JavaScript involved.

What areas do you serve?

York, Etobicoke, North York, Scarborough, Downtown Toronto, East York, Midtown, Wider Greater Toronto Area.

Is care available at night and on weekends?

24/7, with on-call support for urgent needs. Our office keeps regular hours, but care itself is not limited to them.

Are caregivers insured and screened?

Caregivers are fully insured and bonded. Mandatory police background checks. Vulnerable sector screening. Reference verification. Strict hiring and screening standards.

Forms

Styling only — forms are not wired up until phase two. Labels are always visible, required state comes from the attribute rather than the asterisk alone, and errors are announced through aria-describedby with an icon as well as colour.

Enter an email address so we can reply.

Tell us a little about the person needing care.

PDF or Word, up to 5 MB.

Notices

Thank you — your message has been sent

We will be in touch during office hours. For urgent needs, please call us.

Care is available 24/7, with on-call support for urgent needs.

Media

No photography has been supplied yet, so every figure below is rendering its brand treatment. Pass an image_id and a real photo replaces it at exactly the same size — no layout shift, no code change.

16x9
4x3
1x1
portrait

Contact details

Every value below comes from ghc_brand(), so the phone number and address are identical everywhere by construction. Office hours and care availability are rendered as one component precisely so they stay together and stay distinct.

Call us (416) 454-7887 (416) 454-7887
Office hours
Monday to Friday 9:00 AM to 6:00 PM
Saturday 10:00 AM to 4:00 PM
Sunday Closed

Care availability

24/7, with on-call support for urgent needs.

  • York
  • Etobicoke
  • North York
  • Scarborough
  • Downtown Toronto
  • East York
  • Midtown
  • Wider Greater Toronto Area

Service area map

Toronto as a dot grid: one dot in an SVG pattern, tiled and clipped to the city outline, so the halftone costs about two kilobytes instead of the several thousand circles it looks like. Every neighbourhood in ghc_brand() is a pin, and the names sit beside them in chips from 48rem up — below that seven chips cannot fit, so they reveal on hover, focus or tap. Scroll it into view and the pins drop in and settle. The shape is the municipal boundary, which is geography: it is not a coverage line, and it must never be shaded or labelled as one — we serve the wider GTA too, which the band says in words.

Fact cards

The numbered cards under the "Where we work" heading. The card shell, its hover lift and its whole-card focus ring are the same card every grid on the site uses; only the top bar and the fact pinned to the bottom are new. A card with a link shows an arrow and is clickable end to end through one stretched link — never a second control in the corner. A card with no link shows an icon instead, which is what tells the two apart before you point at them.

02

How far we travel

Up to 25-30 km within the GTA

02

How far we travel

Up to 25-30 km within the GTA

Service row

The unit the Home page's "What we do" band is built from: one confirmed service per row, with the first three lines of its includes list and a picture. Point at a row — the background and hairline warm over 400ms, the picture scales to 1.1, and the link fades in; tab to the link and it appears the same way. On a touch screen, where there is no hover to give, the link is simply always visible. Nothing moves the row's height, so a pointer crossing the band cannot shift a target under someone's cursor.

Personal care

Respectful assistance with washing, dressing and daily routines, always at a comfortable pace.

  • Bathing and showering support
  • Dressing and grooming
  • Toileting support
View details

Companionship

Conversation, shared activities and a familiar, friendly presence through the day.

  • Conversation and shared company
  • Walks and outings
  • Hobbies, games and reading together
View details

Meal preparation

Home-cooked meals prepared around personal tastes and dietary preferences.

  • Planning meals around personal preferences
  • Grocery shopping and putting it away
  • Preparing fresh meals and snacks
View details

Service block

The repeating structure of the Services page: heading, description, a tick list of what is included, and a call to action. Every service uses it, so six services cannot become six different shapes. The tick list reads as a specification — only list inclusions the client has confirmed.

Jump nav (sticky on the real page)
Tick list
  • Support with washing, dressing and grooming
  • Help moving safely around the home
  • Company through the day and a friendly presence
  • The same list on a navy band
  • No inverse variant — the surface re-maps the tokens
Fact strip

A term and a fact per item, on one raised panel with rules between them. For the band that answers several short questions at once. Every value comes from ghc_brand() at the call site — nothing here is typed in. Rules appear only once the grid is genuinely in a row.

Where we work
Toronto, Ontario and the Greater Toronto Area
Care availability
24/7, with on-call support for urgent needs.
Where we work
Toronto, Ontario and the Greater Toronto Area
Care availability
24/7, with on-call support for urgent needs.
Where we work
Toronto, Ontario and the Greater Toronto Area
Care availability
24/7, with on-call support for urgent needs.
Tick list — cards

Each point in its own panel, for a band where the list is the content rather than a detail inside one — the About page runs it beside a photograph. Single-column by definition, so the columns argument is ignored. The mark is sized from the tap minimum; it is still decorative and still not a target.

  • Caregivers are fully insured and bonded
  • Mandatory police background checks
  • Caregivers are fully insured and bonded
  • Mandatory police background checks
  • Caregivers are fully insured and bonded
  • Mandatory police background checks
Map embed

Pinned from ghc_brand(), lazy-loaded, and the box is reserved by aspect-ratio so the late iframe cannot shift the page. The "Open in Google Maps" link is the accessible equivalent of an iframe that a screen reader cannot use.

17 Buttonwood Ave, York, ON M6M 2H9, Canada
Open in Google Maps (opens in a new tab)
ghc_section( 'service-block', array( 'slug' => 'personal-care', 'description' => 'Two to four sentences.', 'includes' => array( 'Washing and dressing support', … ), 'surface' => 'soft', ) );

Empty state

Never “coming soon”. State what is true now and offer a useful next step.

No resources published yet

Our team is happy to answer your questions directly in the meantime.

Request a Consultation

Icons

Inherit colour via currentColor. Decorative by default — pass a label only when the icon is the sole carrier of meaning, otherwise a screen reader announces the adjacent text twice.

  • heart-hands
  • chat
  • home
  • meal
  • clock
  • support
  • shield-check
  • user-check
  • clock-around
  • map-pin
  • phone
  • mail
  • calendar
  • clipboard
  • menu
  • close
  • chevron-down
  • arrow-right
  • check
  • sparkle
  • quote