1. Colours
1.1 Navigation
1.2 Accent
2. Typography
2.1 Main Body Copy
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ut bibendum velit. Donec in lectus eget felis ornare ultricies. Nullam elementum cursus felis, vel tincidunt orci luctus id. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nulla elementum ex et tristique aliquam. Nulla quis ultrices nisi, quis sodales quam.
font-family: aaux-next, Trebuchet MS, Arial, sans-serif
font-size: 1rem
2.2 Small Body Copy
Etiam sagittis urna a aliquet bibendum. Suspendisse potenti. Cras pharetra fermentum libero, id tempor mi pharetra quis. Aenean vitae diam vulputate, gravida justo quis, convallis ipsum. Integer quis lectus et lectus ornare semper id eu libero.
font-family: aaux-next, Trebuchet MS, Arial, sans-serif
font-size: 0.8rem
2.3 Hero
Etiam sagittis urna a aliquet bibendum. Suspendisse potenti. Cras pharetra fermentum libero, id tempor mi pharetra quis.
font-family: aaux-next, Trebuchet MS, Arial, sans-serif
font-size: 1.5rem
2.4 Headings
Heading 1
font-family: aaux-next, Trebuchet MS, Arial, sans-serif
font-size: 2rem
font-weight: ultra
text-transform: uppercase
letter-spacing: 0.2em
Heading 2
font-family: aaux-next, Trebuchet MS, Arial, sans-serif
font-size: 1.4rem
font-weight: ultra
text-transform: uppercase
letter-spacing: 0.2em
Heading 3
font-family: aaux-next, Trebuchet MS, Arial, sans-serif
font-size: 1.4rem
font-weight: semibold
Heading 4
font-family: aaux-next, Trebuchet MS, Arial, sans-serif
font-size: 1.2rem
font-weight: semibold
text-transform: uppercase
letter-spacing: 0.2em
Heading 5
font-family: aaux-next, Trebuchet MS, Arial, sans-serif
font-size: 0.9rem
font-weight: semibold
text-transform: uppercase
letter-spacing: 0.2em
Heading 6
font-family: aaux-next, Trebuchet MS, Arial, sans-serif
font-size: 0.75rem
font-weight: normal
text-transform: uppercase
letter-spacing: 0.2em
2.5 Lists
Ordered
- Nulla elementum ex et tristique
- Aliquam. Nulla quis ultrices
- Nisi, quis sodales quam
Unordered
- Nulla elementum ex et tristique
- Aliquam. Nulla quis ultrices
- Nisi, quis sodales quam
2.6 Blockquote
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 citation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit.
3. Form Elements
4. Cards
4.1 (a) Event Card
Image ratio 2:1
Recommended minimum width: 600px
4.1 (b) Event Card
Image ratio 2:1
Recommended minimum width: 600px
4.1 (c) Event Card
Image ratio 2:1
Recommended minimum width: 600px
4.2 Featured Event
4.3 Artwork Tile
4.4 Callout
Our exclusive Guide to the Collections provides an overview of the WAG’s defining collection areas through 400 artwork highlights.
Pick up your copy at
Our exclusive Guide to the Collections provides an overview of the WAG’s defining collection areas through 400 artwork highlights.
Pick up your copy at
4.5 Event Group Block
MakerLabs
Enjoy monthly craft nights with local makers and artists. For ages 14 and up (participants under the age of 18 must be accompanied by a parent or guardian). All supplies and tools are provided. All skill levels welcome.
MakerLabs
Enjoy monthly craft nights with local makers and artists. For ages 14 and up (participants under the age of 18 must be accompanied by a parent or guardian). All supplies and tools are provided. All skill levels welcome.
MakerLabs
Enjoy monthly craft nights with local makers and artists. For ages 14 and up (participants under the age of 18 must be accompanied by a parent or guardian). All supplies and tools are provided. All skill levels welcome.
MakerLabs
Enjoy monthly craft nights with local makers and artists. For ages 14 and up (participants under the age of 18 must be accompanied by a parent or guardian). All supplies and tools are provided. All skill levels welcome.
Background Image
Image ratio 3:1
Recommended size: 1500px X 500px
Images will be resized and cropped upon upload
For mobile (575px and below) the banner will no longer maintain the ratio and will instead be the height of the coloured block, with 5rem margin above it.
Title
H1 style for the text
Background color can be chosen
6. Content Blocks
6.1 Accordion
Fusce suscipit, elit et sagittis pharetra, nulla lacus imperdiet metus, non facilisis augue ante eget nisi. Maecenas vitae massa in dolor hendrerit auctor.
Integer sollicitudin semper magna, ut vestibulum risus sodales in. In euismod felis est, a fermentum neque ultricies nec. Ut pulvinar sed risus quis placerat. Morbi eu malesuada erat. Ut sed consectetur augue, eget molestie risus. Interdum et malesuada fames ac ante ipsum primis in faucibus. Etiam eu odio nisl.
Fusce suscipit, elit et sagittis pharetra, nulla lacus imperdiet metus, non facilisis augue ante eget nisi. Maecenas vitae massa in dolor hendrerit auctor.
Integer sollicitudin semper magna, ut vestibulum risus sodales in. In euismod felis est, a fermentum neque ultricies nec. Ut pulvinar sed risus quis placerat. Morbi eu malesuada erat. Ut sed consectetur augue, eget molestie risus. Interdum et malesuada fames ac ante ipsum primis in faucibus. Etiam eu odio nisl.
Fusce suscipit, elit et sagittis pharetra, nulla lacus imperdiet metus, non facilisis augue ante eget nisi. Maecenas vitae massa in dolor hendrerit auctor.
Integer sollicitudin semper magna, ut vestibulum risus sodales in. In euismod felis est, a fermentum neque ultricies nec. Ut pulvinar sed risus quis placerat. Morbi eu malesuada erat. Ut sed consectetur augue, eget molestie risus. Interdum et malesuada fames ac ante ipsum primis in faucibus. Etiam eu odio nisl.
6.2 Tabs
Content here will stay consistent, regardless of which tab you're on.
Tab One
Donec sit amet sem ut urna condimentum sagittis. Aenean nec ante urna. Ut eget bibendum justo. Donec sed ipsum sit amet nibh tristique auctor ac et dui. Donec sodales malesuada lectus, vitae eleifend justo rutrum non. Nunc non ex volutpat, imperdiet nunc vel, efficitur tellus. Nunc leo mi, rutrum sit amet sodales nec, varius faucibus ex. Proin et augue eu mauris fringilla gravida at nec libero.
Tab Two
Donec sit amet sem ut urna condimentum sagittis. Aenean nec ante urna. Ut eget bibendum justo. Donec sed ipsum sit amet nibh tristique auctor ac et dui. Donec sodales malesuada lectus, vitae eleifend justo rutrum non. Nunc non ex volutpat, imperdiet nunc vel, efficitur tellus. Nunc leo mi, rutrum sit amet sodales nec, varius faucibus ex. Proin et augue eu mauris fringilla gravida at nec libero.
Tab Three
Donec sit amet sem ut urna condimentum sagittis. Aenean nec ante urna. Ut eget bibendum justo. Donec sed ipsum sit amet nibh tristique auctor ac et dui. Donec sodales malesuada lectus, vitae eleifend justo rutrum non. Nunc non ex volutpat, imperdiet nunc vel, efficitur tellus. Nunc leo mi, rutrum sit amet sodales nec, varius faucibus ex. Proin et augue eu mauris fringilla gravida at nec libero.