Your website's "Style Kit"

The first step in designing your website is defining the typography and colours

Please Note: This is not your finalised website design
We’ll design each page once you’re happy with this.

Colours

Bright Green
#73c043
rgb(115,191,68)
TOS Turqouise
#00a9ce
rgb(0, 169, 206)
TOS Medium Green
#45a03e
rgb(69, 160, 62)
TOS Deep Turquoise
#0080a5
rgb(0, 128, 165)
Mid Bg
#433e3c
rgb(0, 128, 165)
Light Bg
#cfcdc9
rgb(207, 205, 201)
TOS Dark Green
#2e7a3c
rgb(46, 122, 60)
Complementary
#002d5b
rgb(0, 45, 91)

Accent Background

Text on an accent background

Accent Alt Background

Text on an accent background

Dark Background

Text on a dark background

Medium Background

Text on a medium background

Light Background

Text on a light background

Paragraph Text

Paragraph heading

Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes demonstraverunt lectores legere me lius quod ii legunt saepius. Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. 
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.

Headings

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Alternative heading style

Light Heading

light paragraph text

Accent Heading

accent paragraph text

Support for Macrons and other text styles

Nā tō rourou, nā taku rourou, ka ora ai te iwi

With your food basket and my food basket the people will thrive

Heading font
ā ē ī ō ū
Ā Ē Ī Ō Ū

Alt Heading font
ā ē ī ō ū
Ā Ē Ī Ō Ū

A text link 
Small Text
Large Text
Tagline

Testimonials

This is a wonderful testimonial about your services or product. Keep it short and readable and choose one that's relevant to the content around it. 
Person's Name
Person's Title
This is a wonderful testimonial about your services or product. Keep it short and readable and choose one that's relevant to the content around it. 
Person's Name
Person's Title

Forms, icon lists & icon box

"*" indicates required fields

Name*
Subject*
This field is for validation purposes and should be left unchanged.

 Icon Box 
(Icon + Heading + text)

Drag a button, link, or anything else into the icon box to place it below the text. Lorem ipsum dolor sit amet elit.

A super simple icon list element.
It has several list items you can easily edit.
Delete rows you don't need.
Duplicate existing rows to add more.
Change the icons per row.
Change the icon padding to adjust the left spacing.

Image, image box & video

Our service is fantastic

We love to help you delight your clients. Here's the secret sauce about how we do that. If you want to see how we can help, jump on the phone today. 

Image Background

Dark Transparent Background

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Box styles

Accent Box
Dark Box
Light Box
Dark Transparent Box
Light Transparent Box
Very Light Transparent Box

Call to action heading

Call to action text
Call to Action
© Top of the South Community Foundation 2024
Photos from Nelsontasman.nzOnly Marlborough and Unsplash.
Made with ♥️ by Avoca in Nelson, New Zealand
diamondrocketthumbs-up

Join Our Newsletter

Get the latest updates from the foundation