Skip to Main Content

Town of Ajax

[gtranslate]

We Use Cookies

This website uses cookies to ensure you get the best user experience. By continuing to use this website, you consent to our use of cookies. Learn about our Cookie Policy.

Home Pattern Library

Pattern Library Part Two - Image Banner

Secondary Heading Lorem Ipsum

Tertiary Heading Lorem Ipsum Dolor Sit Amet

Quaterary Heading Lorem Ipsum Dolor Sit Amet

Introduction body, used for showcasing text within a colour block lorem ipsum enim egestas.

Body, duis ex potenti maximus egestas mus est habitant taciti enim. Imperdiet sollicitudin torquent, nunc habitant cursus sit. Nunc cubilia platea cursus vivamus aenean maximus egestas conubia habitant cursus sit.

Micro, a vestibulum quam. Quisque pharetra vestibulum bibendum. Mauris sagittis finibus mauris eget egestas. Nulla ornare sem velit, sed auctor nibh egestas in. Nam quis rhoncus.

Primary Button
Secondary Button
Tertiary Button

Secondary Heading

Tertiary Heading Lorem Ipsum

Body, duis ex potenti maximus egestas mus est habitant taciti enim. Imperdiet sollicitudin torquent, nunc habitant cursus sit. Nunc cubilia platea cursus.

Primary Button
Secondary Button

Secondary Heading

Tertiary Heading Lorem Ipsum

Body, duis ex potenti maximus egestas mus est habitant taciti enim. Imperdiet sollicitudin torquent, nunc habitant cursus sit. Nunc cubilia platea cursus.

Primary Button
Secondary Button

Secondary Heading

Body, duis ex potenti maximus egestas mus est habitant taciti enim. Imperdiet sollicitudin torquent, nunc habitant cursus sit. Nunc cubilia platea cursus.

Primary Button
Secondary Button
Tertiary Button

Secondary Heading

Body, duis ex potenti maximus egestas mus est habitant taciti enim. Imperdiet sollicitudin torquent, nunc habitant cursus sit. Nunc cubilia platea cursus.

Primary Button
Secondary Button
Tertiary Button

Secondary Heading

Body, duis ex potenti maximus egestas mus est habitant taciti enim. Imperdiet sollicitudin torquent, nunc habitant cursus sit. Nunc cubilia platea cursus.

Primary Button
Secondary Button
Tertiary Button

Simple Cards

Three-Column

Simple Card Title Lorem Ipsum

Optional excerpt lorem ipsum nulla venenatis pulvinar quis dapibus elit nullam sed justo.

Simple Card Title Lorem Ipsum

Optional excerpt lorem ipsum nulla venenatis pulvinar quis dapibus elit nullam sed justo.

Simple Card Title Lorem Ipsum

Optional excerpt lorem ipsum nulla venenatis pulvinar quis dapibus elit nullam sed justo.

Two-Column

Simple Card Title Lorem Ipsum

Optional excerpt lorem ipsum nulla venenatis pulvinar quis dapibus elit nullam sed justo.

Simple Card Title Lorem Ipsum

Optional excerpt lorem ipsum nulla venenatis pulvinar quis dapibus elit nullam sed justo.

Four-Column

Simple Card Title Lorem Ipsum

Optional excerpt lorem ipsum nulla venenatis pulvinar quis dapibus elit nullam sed justo.

Simple Card Title Lorem Ipsum

Optional excerpt lorem ipsum nulla venenatis pulvinar quis dapibus elit nullam sed justo.

Simple Card Title Lorem Ipsum

Optional excerpt lorem ipsum nulla venenatis pulvinar quis dapibus elit nullam sed justo.

Simple Card Title Lorem Ipsum

Optional excerpt lorem ipsum nulla venenatis pulvinar quis dapibus elit nullam sed justo.

Simple Call-out Module

On White Background

Massa metus eros augue orci, elit pellentesque dui conubia. Duis ex potenti maximus egestas mus est habitant taciti enim. Imperdiet sollicitudin torquent, nunc habitant cursus sit. Nunc cubilia platea cursus vivamus aenean. Nisi conubia mi in varius maximus quisque. Vitae nam non pulvinar lacus dui vel.

Simple call-out ipsum odor amet, bold adipiscing elit. nceptos italicize phasellus at sed etiam; massa platea. Ut link goes here dapibus vivamus inceptos.

Massa metus eros augue orci, elit pellentesque dui conubia. Duis ex potenti maximus egestas mus est habitant taciti enim. Imperdiet sollicitudin torquent, nunc habitant cursus sit. Nunc cubilia platea cursus vivamus aenean. Nisi conubia mi in varius maximus quisque. Vitae nam non pulvinar lacus dui vel.

Simple Call-out Module

On Beige Background

Massa metus eros augue orci, elit pellentesque dui conubia. Duis ex potenti maximus egestas mus est habitant taciti enim. Imperdiet sollicitudin torquent, nunc habitant cursus sit. Nunc cubilia platea cursus vivamus aenean. Nisi conubia mi in varius maximus quisque. Vitae nam non pulvinar lacus dui vel.

Simple call-out ipsum odor amet, bold adipiscing elit. nceptos italicize phasellus at sed etiam; massa platea. Ut link goes here dapibus vivamus inceptos.

Massa metus eros augue orci, elit pellentesque dui conubia. Duis ex potenti maximus egestas mus est habitant taciti enim. Imperdiet sollicitudin torquent, nunc habitant cursus sit. Nunc cubilia platea cursus vivamus aenean. Nisi conubia mi in varius maximus quisque. Vitae nam non pulvinar lacus dui vel.

Decorative Call-out Module Optional Title

Decorative call-out ipsum odor amet, bold adipiscing elit. nceptos italicize phasellus at sed etiam; massa platea. Ut link goes here dapibus vivamus inceptos. Decorative call-out ipsum odor amet, bold adipiscing elit.

Optional Link

Table Module Primary Heading Lorem

Wide Secondary Heading Lorem Ipsum

Introduction body, Massa metus eros augue orci, elit pellent esque dui maximus egestas conubia habitant cursus sit.

Column 1 Column 2 Column 3
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell

Footnote: Lorem ipsum odor amet, italicize adipiscing elit. Ut viverra dapibus vivamus inceptos pharetra.

Table Module Primary Heading Lorem

Narrow Secondary Heading Lorem Ipsum

Introduction body, Massa metus eros augue orci, elit pellent esque dui maximus egestas conubia habitant cursus sit.

Column 1 Column 2 Column 3
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell

Footnote: Lorem ipsum odor amet, italicize adipiscing elit. Ut viverra dapibus vivamus inceptos pharetra.

Accordion Module Primary Heading Lorem Ipsum

Secondary Heading Lorem Ipsum

Introduction body, Massa metus eros augue orci, elit pellent esque dui maximus egestas conubia habitant cursus sit.

Body, duis ex potenti maximus egestas mus est habitant taciti enim. Imperdiet sollicitudin torquent, nunc habitant cursus sit. Nunc cubilia platea cursus vivamus aenean maximus egestas conubia habitant cursus sit.

Tertiary Heading Lorem Ipsum Dolor Sit Amet

Introduction body, Massa metus eros augue orci, elit pellent esque dui maximus egestas conubia habitant cursus sit.

Body, duis ex potenti maximus egestas mus est habitant taciti enim. Imperdiet sollicitudin torquent, nunc habitant cursus sit. Nunc cubilia platea cursus vivamus aenean maximus egestas conubia habitant cursus sit.

  1. Body paragraph bullets level one
  2. Body paragraph bullets level one lorem ipsum cubilia platea cursus vivamus aenean
  3. Body paragraph bullets level one lorem ipsum
    1. Body paragraph bullets level two
    2. Body paragraph bullets level two lorem ipsum
      1. Body paragraph bullets level three
Primary Button
Secondary Button

With Landscape Image

Optional caption with small paragraph a vestibulum quam. Quisque pharetra vestibulum bibendum. Mauris sagittis finibus mauris eget.

Column 1 Column 2 Column 3
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell
Cell Cell Cell

Body, duis ex potenti maximus egestas mus est habitant taciti enim. Imperdiet sollicitudin torquent, nunc habitant cursus sit. Nunc cubilia platea cursus vivamus aenean maximus egestas conubia habitant cursus sit.

  1. Body paragraph bullets level one
  2. Body paragraph bullets level one lorem ipsum cubilia platea cursus vivamus aenean
  3. Body paragraph bullets level one lorem ipsum
    1. Body paragraph bullets level two
    2. Body paragraph bullets level two lorem ipsum
      1. Body paragraph bullets level three

Body, duis ex potenti maximus egestas mus est habitant taciti enim. Imperdiet sollicitudin torquent, nunc habitant cursus sit. Nunc cubilia platea cursus vivamus aenean maximus egestas conubia habitant cursus sit.

  1. Body paragraph bullets level one
  2. Body paragraph bullets level one lorem ipsum cubilia platea cursus vivamus aenean
  3. Body paragraph bullets level one lorem ipsum
    1. Body paragraph bullets level two
    2. Body paragraph bullets level two lorem ipsum
      1. Body paragraph bullets level three

Body, duis ex potenti maximus egestas mus est habitant taciti enim. Imperdiet sollicitudin torquent, nunc habitant cursus sit. Nunc cubilia platea cursus vivamus aenean maximus egestas conubia habitant cursus sit.

  1. Body paragraph bullets level one
  2. Body paragraph bullets level one lorem ipsum cubilia platea cursus vivamus aenean
  3. Body paragraph bullets level one lorem ipsum
    1. Body paragraph bullets level two
    2. Body paragraph bullets level two lorem ipsum
      1. Body paragraph bullets level three

Gallery Module Lorem a Dolor Sit Amet

Secondary Heading Lorem Ipsum

Introduction body, Massa metus eros augue orci, elit pellent esque dui maximus egestas conubia habitant cursus sit.

Cards Module: To News & Public Notices

Secondary Heading Lorem Ipsum

Introduction body, Massa metus eros augue orci, elit pellent esque dui maximus egestas conubia habitant cursus sit.

card image for

Development/­​Planning Notices

Revised Planning Application
Optional Exerpt. Be the first for a more lenient AUD Permit

February 6, 2026
card image for

Parks & Recreation

Splash Pads Open up for the Season
Cool off at Town facilities, splash pads are officially open for the season.

February 6, 2026

Cards Module: Events

Secondary Heading Lorem Ipsum

Introduction body, Massa metus eros augue orci, elit pellent esque dui maximus egestas conubia habitant cursus sit.

Mar

23

-

Apr

06

Event Topic

Camp Family 2025 Recurring Event
12:00am – 11:59pm

Mar

22

-

Apr

05

Event Topic

Camp Family 2025 Recurring Event
12:00am – 11:59pm

Mar

16-30

Event Topic

Camp Family 2025 Recurring Event
12:00am – 11:59pm

iFrame Primary Heading Red Background

Secondary Heading Lorem Ipsum

Introduction body, Massa metus eros augue orci, elit pellent esque dui maximus egestas conubia habitant cursus sit.

iFrame Primary Heading Red Background

Secondary Heading Lorem Ipsum

Introduction body, Massa metus eros augue orci, elit pellent esque dui maximus egestas conubia habitant cursus sit.

Tax Calculator

Introduction body, Massa metus eros augue orci, elit pellent esque dui maximus egestas conubia habitant cursus sit.

Body, duis ex potenti maximus egestas mus est habitant taciti enim. Imperdiet sollicitudin torquent, nunc habitant cursus sit. Nunc cubilia platea cursus vivamus aenean maximus egestas conubia habitant cursus sit.

$

Contact Module

Secondary Heading Lorem Ipsum

Address Teirtariy Heading

Quarternary Heading Lorem Ipsum

1955 Audley Rd, Ajax, ON L1Z 0L2

Phone Numbers

Quarternary Heading Lorem Ipsum
1-905-683-4000
Quarternary Heading Lorem Ipsum
1-905-683-4000

Hours

Monday - Friday: :

9:00 a.m. to 9:00 p.m.

Saturday & Sunday:

9:00 a.m. to 5:00 p.m.

Form Module Primary Heading Lorem Ipsum

Secondary Heading Lorem Ipsum

Body, duis ex potenti maximus egestas mus est habitant taciti enim. Imperdiet sollicitudin torquent, nunc habitant cursus sit. Nunc cubilia platea cursus vivamus aenean maximus egestas conubia habitant cursus sit.

  1. Body paragraph bullets level one
  2. Body paragraph bullets level one lorem ipsum cubilia platea cursus vivamus aenean
  3. Body paragraph bullets level one lorem ipsum
    1. Body paragraph bullets level two
    2. Body paragraph bullets level two lorem ipsum
      1. Body paragraph bullets level three
Optional helper text
MM slash DD slash YYYY
Optional helper text
Optional helper text
Optional helper text
File information goes here including acceptable file types and max size.
Max. file size: 40 MB.
Drop files here or
Max. file size: 40 MB.
    Optional helper text
    Checkboxes
    Radio Button Title

    Form Module

    2-Column Layout

    Body, duis ex potenti maximus egestas mus est habitant taciti enim. Imperdiet sollicitudin torquent, nunc habitant cursus sit. Nunc cubilia platea cursus vivamus aenean maximus egestas conubia habitant cursus sit.

    1. Body paragraph bullets level one
    2. Body paragraph bullets level one lorem ipsum cubilia platea cursus vivamus aenean
    3. Body paragraph bullets level one lorem ipsum
      1. Body paragraph bullets level two
      2. Body paragraph bullets level two lorem ipsum
        1. Body paragraph bullets level three
    Optional helper text
    Optional helper text
    Optional helper text
    Optional helper text

    Multi-Page Setup Form

    Step 1 of 3

    Optional helper text

    Primary Heading Lorem a Dolor Sit Amet

    Secondary Heading Lorem Ipsum

    Tertiary Heading Lorem Ipsum Dolor Sit Amet

    Quaterary Heading Lorem Ipsum Dolor Sit Amet

    Introduction body, Massa metus eros augue orci, elit pellent esque dui maximus egestas conubia habitant cursus sit.

    Body, duis ex potenti maximus egestas mus est habitant taciti enim. Imperdiet sollicitudin torquent, nunc habitant cursus sit. Nunc cubilia platea cursus vivamus aenean maximus egestas conubia habitant cursus sit.

    Micro, a vestibulum quam. Quisque pharetra vestibulum bibendum. Mauris sagittis finibus mauris eget egestas. Nulla ornare sem velit, sed auctor nibh egestas in. Nam quis rhoncus.

    Primary Button
    Secondary Button
    Tertiary Button

    With Video

    Video link: https://www.youtube.com/embed/X-HL-r5TOiU?rel=0

    Optional caption with small paragraph a vestibulum quam. Quisque pharetra vestibulum bibendum. Mauris sagittis finibus mauris eget.

    Secondary Heading Lorem Ipsum Landscape Image

    Lorem ipsum odor amet, consectetuer adipiscing elit. Ut viverra dapibus vivamus inceptos pharetra. Nam ultrices nunc euismod faucibus luctus nec facilisi. Gravida magnis ridiculus felis ut eu natoque nostra. Aliquam quam fermentum scelerisque sit quis donec fames. Molestie phasellus class ad tristique lacinia blandit platea.

    Primary Button

    Video link: https://www.youtube.com/embed/X-HL-r5TOiU?rel=0

    Secondary Heading Lorem Ipsum Landscape Image

    Lorem ipsum odor amet, consectetuer adipiscing elit. Ut viverra dapibus vivamus inceptos pharetra. Nam ultrices nunc euismod faucibus luctus nec facilisi. Gravida magnis ridiculus felis ut eu natoque nostra. Aliquam quam fermentum scelerisque sit quis donec fames. Molestie phasellus class ad tristique lacinia blandit platea.

    Primary Button