Desktop Text formatting:

H1 — Orpheus Pro — 68 / 70 — Sentence case — 0 Char spacing — Default (400 weight)

Page header

H2 — Orpheus Pro — 48 / 50 — Sentence case — 0 Char spacing — Default (400 weight)

Section Header

H3 — Orpheus Pro — 20 / 22 — ALL CAPS — 5px Char spacing — Medium (600 weight)

SUBHEADERS

H4 — Montserrat — 14 / 18 — ALL CAPS —5px Char spacing — Medium (600 weight)

EYEBROW / PREHEADERS

Body — Lato — 16 / 24 — Sentence Case — 0.5px Char spacing — Normal (400 weight)

Body copy. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

CTA TEXT — Montserrat — 16 / 22 — ALL CAPS — 5px Char spacing — Medium (500 weight)

BUTTON — 40px padding sides — 12px padding top/bottom.

CTA BUTTON

Simple landing page headers

BRANDS NEEDED:

Snack Box, Boutique, Market, & Hello Kitty

COLOR OPTIONS:

No need for all color options. Just the four headers below.

GENERAL NOTES:

No menu or nav needed in this.

Image with text block

BRANDS NEEDED:

Snack Box, Boutique, Market, & Hello Kitty

COLOR OPTIONS:

All colors outlined in Figma Color blocks

TOGGLES NEEDED:

  1. Image placement on left/right?
  2. Hide secondary image
  3. Hide vertical japanese text
  4. Upload video in liu or image

GENERAL NOTES:

On mobile, image(s) should always live above text.

On mobile, hide vertical Japanese text always

SUB HEADER ALL CAPS

Title Case Header Goes Here

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

GET MY BOKKSU

3 column desktop + carousel mobile view

Title Case Headline

TITLE (ALL CAPS)

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

TITLE (ALL CAPS)

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

TITLE (ALL CAPS)

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

3 step section with icons

ALL CAPS SUBHEADER

Sentence case header here.

TITLE (ALL CAPS)

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

TITLE (ALL CAPS)

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

TITLE (ALL CAPS)

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Full Width Banner (Desktop) + Full Height Image (Mobile)

SUB HEADER ALL CAPS

Title Case Header

Goes Here

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

GET MY BOKKSU

CAPS EYEBROW COPY

Sentence case header here.

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

GET MY BOKKSU

Full Width Banner (Desktop) + Square Image (Mobile)

SUB HEADER ALL CAPS

Title Case Header

Goes Here

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

GET MY BOKKSU

PREMIUM SUBSCRIPTION

Discover Japan

Through Snacks

Authentic snacks delivered to you monthly from Japan with free shipping!

GET MY BOKKSU

Image Carousel with text headlines

Title Case Header

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Promo code callout banner

SAVE AMOUNT OFF YOUR FIRST BOX WITH CODE

CODE HERE

Product details section

ALL CAPS TITLE

ALL CAPS TITLE

GET MY BOKKSU

Quote with image carousel below

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

– NAME HERE

Press logos

FEATURED BY

Sub Box panels header (layout with code field)

CHOOSE YOUR PLAN

Snack Box Subscription

SAVE AMOUNT OFF YOUR FIRST BOX WITH CODE CODE HERE

Sub Box panels (standard layout)

CHOOSE YOUR PLAN

Snack Box Subscription

Sub Box Panels with stacked toggles

12

MONTHS

$39.99

/MO

You save $120.00

6

MONTHS

$43.99

/MO

You save $36.00

3

MONTHS

$45.99

/MO

You save $12.00

1

MONTH

$49.99

/MO

FAQ accordions

STILL HAVE QUESTIONS?
FAQ

Landing Page Footer

HAPPY SNACKING | BOKKSU 2022