Swimming New Brunswick
This page demonstrates the typography, colours, components and custom styling used throughout the Swimming New Brunswick website.
Brand Colours
The primary website theme is based on the official Swimming New Brunswick logo colours.
Green / Teal
#004C45
Blue
#00A9E0
Red
#E10027
Typography
Heading levels and standard body typography.
Heading One
Heading Two
Heading Three
Heading Four
Heading Five
Heading Six
This is standard body text. Swimming New Brunswick supports swimmers, clubs, coaches, officials and the broader competitive swimming community throughout the province.
This is lead text used when an introduction needs additional prominence.
This is muted supporting text.
This paragraph contains a standard text link so normal and hover link colours can be tested.
Buttons
Primary, secondary and outline button treatments.
Buttons on a Dark Background
This checks contrast when buttons appear inside branded sections.
Cards
Standard Bootstrap cards used for programs, resources, news and other structured content.
Swimmer Development
Example content showing the standard card treatment used throughout the site.
High Performance
Contextual cards should remain readable when placed on a branded background.
Upcoming Championship
Red is reserved for stronger highlights and calls to action.
Provincial Swimming
This demonstrates the standard large feature or page-heading treatment.
Alerts and Badges
Provincial Group Colours
These colours are available as optional program and swimmer-group identifiers and are separate from the main site theme.
Dark Green Group
Group colours can also be used as a subtle border rather than filling an entire component.
Maroon Group
This provides another visual option for distinguishing swimmer programs.
Gold Group
The group colours remain intentionally independent of normal site components.
List Groups
Tables
Tables are common throughout Pool Queue and should remain clean and readable.
| Event | Location | Date | Status |
|---|---|---|---|
| Provincial Championships | Fredericton | March 12–15 | Upcoming |
| Development Meet | Moncton | April 18 | Open |
| Summer Championships | Saint John | July 9–12 | Featured |
Forms
Form controls help verify focus states, borders and input readability.
Breadcrumbs
Pagination
Background Treatments
Light Background
Standard light supporting section.
Primary Background
Swimming New Brunswick teal treatment.
Secondary Background
Strong red accent treatment.
Dark Background
Deep teal treatment suitable for prominent sections and footer-style areas.
Theme Test Complete
If all of the components above are balanced, readable and consistent, the base theme is ready for bespoke site content.