Typography

Font Styles

u-text-display

Heading

u-text-h1

Heading

u-text-h2

Heading

u-text-h3

Heading

u-text-h4

Heading

u-text-h5

Heading

u-text-h6

Heading

u-text-large

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare

u-text-medium-large

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare

u-text-main

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare

u-text-small

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare

u-text-italic

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare

u-text-underline

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare

u-text-semi-bold

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare

u-text-bold

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare

u-reset-margin-padding

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare

u-text-link

Text Link

u-navigation-link

Font Weight

u-weight-regular

Lorem ipsum dolor

u-weight-medium

Lorem ipsum dolor

u-weight-bold

Lorem ipsum dolor

Typography Elements

u-rich-text

Lorem ipsum

Lorem ipsum dolor sit amet, consectetur

All Ordered List

This is some text
This is some text
This is some text

All Unordered List

This is some text
This is some text
This is some text

u-list-no-styling

This is some text
This is some text
This is some text

All Block Quotes

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do

Color

Text Color

u-color-brand

Lorem ipsum dolor

u-color-secondary

Lorem ipsum dolor

u-background-primary

Lorem ipsum dolor

u-background-pink

Lorem ipsum dolor

u-background-gold

Lorem ipsum dolor

u-background-blue

Lorem ipsum dolor

u-text-color-primary

Lorem ipsum dolor

Grid

Grid Utilities

u-grid-custom

u-grid-column-2

u-grid-column-3

u-grid-column-4

u-grid-autofit

u-grid-subgrid-12

u-grid-inner-6

Column Utilities

u-column-custom

u-column-full

u-column-indent

u-column-1

u-column-2

u-column-3

u-column-4

u-column-5

u-column-6

u-column-7

u-column-8

u-column-9

u-column-10

u-column-11

u-column-12

Order Utilities

u-order-first

u-order-first-desktop

u-order-first-tablet

u-order-last

u-order-last-desktop

u-order-last-tablet

Flex items

Grid Utilities

Flex / Horizontal / 2

Flex / verticle / 2

Flexbox

Horizontal Flex Utilities

u-hflex-left-top

u-hflex-left-center

u-hflex-left-bottom

u-hflex-left-stretch

u-hflex-center-top

u-hflex-center-center

u-hflex-center-bottom

u-hflex-center-stretch

u-hflex-right-top

u-hflex-right-center

u-hflex-right-bottom

u-hflex-right-stretch

u-hflex-between-top

u-hflex-between-center

u-hflex-between-bottom

u-hflex-between-stretch

Vertical Flex Utilities

u-vflex-left-top

u-vflex-left-center

u-vflex-left-bottom

u-vflex-left-between

u-vflex-center-top

u-vflex-center-center

u-vflex-center-bottom

u-vflex-center-between

u-vflex-right-top

u-vflex-right-center

u-vflex-right-bottom

u-vflex-right-between

u-vflex-stretch-top

u-vflex-stretch-center

u-vflex-stretch-bottom

u-vflex-stretch-between

Flex Wrap Utilities

u-hflex-wrap

u-hflex-nowrap

u-vflex-wrap

u-vflex-nowrap

Spacing

Gap Utilities

u-gap-none

u-gap-main

u-gap-xsmall

u-gap-small

u-gap-medium

u-gap-large

Verticle spacing

u-verticle-even-small

u-verticle-even-medium

u-verticle-even-large

u-verticle-odd-small

u-verticle-odd-medium

u-verticle-odd-large

Miscellaneous

Other Utilities

u-height-screen

u-max-width-none

u-visual-wrap

u-overflow-hidden

u-display-none

u-padding-large

u-padding-main

u-padding-small

u-display-none

Visual / Cover

Visual / Absolute

Componets

Prevent Style Cleanup

Components

Btn / Main / With link

Find out more

Btn / Secondary / With link

Learn more

Btn / Main Arrow / With link

Learn more

Btn / Main Arrow / With link

Learn more

Btn / Secondary Arrow / With link

Learn more

Btn / Secondary Arrow / With link

Learn more

Featured / List / Horizontal

Lorem ipsum dolor sit amet,

Featured / List / Vertical

Lorem ipsum dolor sit amet,

Featured / List / Text Horizontal

Heading

Lorem ipsum dolor sit amet,

Start new

Featured / List / Text Horizontal

Heading

Lorem ipsum dolor sit amet,

Start new

Featured / List / Text Vertical

Heading

Lorem ipsum dolor sit amet,

Featured / List / Text Vertical

Heading

Lorem ipsum dolor sit amet,

Featured / List / Group / Horizontal

Lorem ipsum dolor sit amet,

Featured / List / Group / Vertical

Lorem ipsum dolor sit amet,

Featured / List / Group / Text Horizontal

Heading

Lorem ipsum dolor sit amet,

Heading

Lorem ipsum dolor sit amet,

Featured / List / Group / Text Horizontal

Heading

Lorem ipsum dolor sit amet,

Heading

Lorem ipsum dolor sit amet,

Card / 01

Category

This is some text

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.

Learn more

Full Name

Lorem ipsum dolor sit amet,

Blog / Card / 01

Category

This is some text

Learn more

Full Name

Lorem ipsum dolor sit amet,

Card / 01

Category

This is some text

Learn more

Full Name

Lorem ipsum dolor sit amet,

Card / 01

Category

This is some text

Learn more

Thank you! Your submission has been received!

Oops! Something went wrong while submitting the form.

Card / 01

Category

This is some text

Learn more

Thank you! Your submission has been received!

Oops! Something went wrong while submitting the form.

Icons

Global

Forms

Form

Thank you! Your submission has been received!

Oops! Something went wrong while submitting the form.

Why Hyperjar

Discover how you can save money with Hyperjar

Get cashback

Make the most of your money, with rewards for loyalty, vouchers, offers and instant money back.

More about prepaid cards

Earn and save money

Many ways to earn, or save, or both, with loyalty and our generated gift cards.

Find out more

Split the bill

Share jars with friends or family, so everyone can save and spend together.

Spending together

Overseas without transaction fees

With your Hyperjar card abroad you’ll get Mastercard’s best exchange rate, and no additional fees. Spend in 36 million+ locations across 200 countries. Also handy when you shop online from the UK with a retailer in another country.

Travel money: learn more

Prepaid cards for kids

More about Hyperjar 616

As seen in

Freeze and unfreeze your card instantly in the app

Face or fingerprint ID for extra security

Whether for yourself or a dependant’s card, add or block any shop

See all reviews

Everyone should get it!

Everyone should have this app! Customer live chat is very fast and my issue was resolved within a couple of minutes. Love how organised my finances are now. How did I ever manage without it! Would definitely recommend.

Sally

Everyone should get it!

Sally

Everyone should get it!

Sally

Latest articles

View all articles

Money management

What is a ‘trapped in place’ economy and does the UK have one?

April 4, 2024

Money management

What is a ‘trapped in place’ economy and does the UK have one?

April 4, 2024

Money management

What is a ‘trapped in place’ economy and does the UK have one?

April 4, 2024