heading-xlarge

heading-large

heading-medium

heading-small

heading-xsmall

text-weight-light

text-weight-normal

text-weight-medium

text-weight-semibold

text-weight-bold

text-weight-xbold

text-size-large
Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text.

text-size-medium
Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text.

text-size-regular
Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text.

text-size-small
Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text.

text-size-tiny
Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text.

text-style-strikethrough

text-style-italic

text-style-muted

text-style-allcaps

text-style-nowrap

text-style-quote
Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text.

text-style-2lines
Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text.

text-style-3lines
Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text.dolor sit amet,

Label

text-align-left

text-align-center

text-align-right

Rich text headline

The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.

A sample block quote inside a rich text block. Sample text is being used as a placeholder for real text that is normally present.

Static and dynamic content editing

A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila!

Sample text is being used as a placeholder for real text that is normally present.
Sample text is being used as a placeholder for real text that is normally present.
Sample text is being used as a placeholder for real text that is normally present.

Image with caption

How to customize formatting for each rich text

Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element. Here is some Bold Text, some Italicised Text and a text link.

Media embed sample

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

.icon

Social Icons

.button

.button.is-fullwidth

.Button.is-secondary

.Button.is-small

.Button.is-large

Store Buttons

Link Styles

All Links text-style-link

Icon Link

Navbar Component

Process Notifications

Standard notification component.

Alert! Something went wrong while submitting the form.

Success! That went well.

Warning! Something’s not quite right.

Form Elements

Thank you!
Your submission has been received!

Oops! Something went wrong while submitting the form.

Tab Component

Content 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Content 2

Content 3

Cookie widget elements

Protected Page

text-color-primary

text-color-body-dark

text-color-body-light

text-color-black

text-color-grey

background-color-primary

background-color-primary-200

background-color-primary-800

background-color-body

background-color-body-text

background-color-grey

background-color-process-info

background-color-process-alert

background-color-process-success

background-color-process-warning

Style Guide

A useful guide for using your brand online

Logo

Your brand logo variants.

Main Logo

Colours

Your brand colour palette.

brand Colours

Primary

#c88f42

c5 m40 y71 k10

Pantone 7510 or Gold Leaf

Primary - 200

#f8d869

Primary - 800

#815929

Body Colours

Body Text

#47453f

c0 m0 y0 k90

Medium Grey

#989387

c0 m0 y0 k45

Dark Grey 1

#262521

Dark Grey 2

#34322e

c15 m18 y20 k88

Pantone Black 7

Body Background

#f3f2ed

c0 m0 y2 k4

Light Grey 1

#e5e3db

c0 m0 y0 k10

Light Grey 2

#d0cec4

c0 m0 y0 k20

Process Colours

Alert

#ec2000

Info

#0088ff

Success

#00cd66

Warning

#eaa000

Text Colours

text-color-primary

text-color-body-dark

text-color-white

text-color-body-light

text-color-black

text-color-grey

Background Colours

background-color-primary

background-color-primary-200

background-color-primary-800

background-color-body

background-color-body-text

backgound-color-dark-grey-1

backgound-color-dark-grey-2

background-color-grey

background-color-light-grey-1

background-color-light-grey-2

background-color-process-info

background-color-process-alert

background-color-process-success

background-color-process-warning

Core Type

The core font is System UI font.

Standard Headings

H1
Sample text is being used as a placeholder.

H2
Sample text is being used as a placeholder as real text.

H3
Sample text helps you understand how real text may look on your website.

H4
Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look.

H5
Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text.

H6
Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text that is normally present.

Heading Classes

heading-display

heading-xxlarge

heading-xlarge

heading-large

heading-medium

heading-small

heading-xsmall

Body Copy

All Paragraphs
Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text.

Buttons

Icon styles and sizes.

.button

Button

.button.is-fullwidth

Button

.Button.is-hollow

Button

Links

Link styles

Link Styles

All Links

text-style-link

Icon Link

Text Utilities

The core font is System UI font.

Text Weights

text-weight-light

text-weight-normal

text-weight-medium

text-weight-semibold

text-weight-bold

Text Block Styles

All Block Quotes
Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text.

Unordered List

Sample text is being used as a placeholder for real text that is normally present.
Sample text is being used as a placeholder for real text that is normally present.
Sample text is being used as a placeholder for real text that is normally present.

ordered List

Sample text is being used as a placeholder for real text that is normally present.
Sample text is being used as a placeholder for real text that is normally present.
Sample text is being used as a placeholder for real text that is normally present.

Truncated Text

text-style-4lines
Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text.dolor sit amet,

Text Styles

text-style-strikethrough

text-style-italic

text-style-muted

text-style-allcaps

text-style-nowrap

Text Alignment

text-align-left

text-align-center

text-align-right

Icons

Icon styles and sizes.

.icon

Social Icons

Rich Text

Icon styles and sizes.

.text-rich-text

Rich text headline

A sample block quote inside a rich text block. Sample text is being used as a placeholder for real text that is normally present.

Static and dynamic content editing

Sample text is being used as a placeholder for real text that is normally present.
Sample text is being used as a placeholder for real text that is normally present.
Sample text is being used as a placeholder for real text that is normally present.

Image with caption

How to customize formatting for each rich text

Media embed sample

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

Forms

Form elements and options.

Form Elements

Thank you!
Your submission has been received!

Oops! Something went wrong while submitting the form.

Navbar

Style for main navigation bar.

Navbar Component

Dropdown

Tab component styles.

.Dropdown

Tabs

Tab component styles.

Tab Component

Content 1

Content 2

Content 3

Notifications

Colour coded notification components.

Process Notifications

Standard notification component.

Alert! Something went wrong while submitting the form.

Success! That went well.

Warning! Something’s not quite right.

Table

Custom styles for html embed tables

Scroll table →

Intervention Level	Objective of Level	Nature of Interventions within Level	Disclosure Availability	Expected Outcome
Level 1	Support compliance by reminding taxpayers of their obligations	Occurs when Revenue has not already engaged in any detailed examination of taxpayer/issue. Reminder Notification of outstanding tax returns. Request to self-review Profile Interview Interaction under the Co-operative Compliance Framework (CCF)	Unprompted Qualifying Disclosure	Tax plus statutory interest Most reduced penalties No publication No Prosecution
Level 2	Confront compliance risks based on the circumstances and behaviour of the taxpayers concerned.	Occurs once Revenue has identified a risk/risks in respect of a taxpayer. Audits Risk Review	Prompted Qualifying Disclosure	Tax plus statutory interest Reduced penalties No publication No Prosecution
Level 3	Focused on cases displaying risks of suspected fraud and tax evasion	Investigations	No Qualifying disclosures	Tax plus statutory interest Higher penalties Publication (if threshold conditions met) Prosecution (in certain cases)

Cookie

Cookie widget setup for iubenda integration.

Cookie widget elements

Hidden Styles

Adding all hidden styles

.box-shadow-small

.i-reveal-fade-up

Splide

heading-xlarge

heading-large

heading-medium

heading-small

heading-xsmall

Rich text headline

Static and dynamic content editing

Image with caption

How to customize formatting for each rich text

Media embed sample

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

Content 1

Content 2

Content 3

Protected Page

Style Guide

Logo

Colours

Core Type

H1Sample text is being used as a placeholder.

H2Sample text is being used as a placeholder as real text.

H3Sample text helps you understand how real text may look on your website.

H4Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look.

H5Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text.

H6Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text that is normally present.

heading-display

heading-xxlarge

heading-xlarge

heading-large

heading-medium

heading-small

heading-xsmall

Buttons

Links

Text Utilities

Icons

Rich Text

Rich text headline

Static and dynamic content editing

Image with caption

How to customize formatting for each rich text

Media embed sample

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

Forms

Navbar

Dropdown

Tabs

Content 1

Content 2

Content 3

Notifications

Table

Cookie

Hidden Styles

H1
Sample text is being used as a placeholder.

H2
Sample text is being used as a placeholder as real text.

H3
Sample text helps you understand how real text may look on your website.

H4
Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look.

H5
Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text.

H6
Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text that is normally present.