PRESS BUTTER SAND

lorem ipsum, lorem.

lorem ipsum dolor sit

PRESS BUTTER SAND(buttersand.com)lorem ipsum dolor sit amet consectetur adipiscing. lorem A lorem ipsum dolor(Shippori Mincho lorem)lorem Futura LT Pro(Jost lorem)lorem ipsum dolor, font-feature-settings: normal(palt lorem), letter-spacing lorem(0.15em / 0.125em / 0.05em), lorem ipsum dolor #ff3300 lorem #000000 lorem ipsum dolor sit amet consectetur, radius 0px lorem CTA. computed style lorem ipsum dolor.

PRODUCTS VIEW MORE

01 / COLORS

COLOR PALETTE

Color Palette -- Brand Orange #ff3300 + Monotone (Black / Gray / White)

BRAND

Brand Orange

#ff3300

CTA / Section Title / Accent

Black

#000000

Hero BG / Body Text

TEXT

Text Primary

#000000

Body / News Title

Text Dark

#231815

Footer Dark Text

Text Dark Alt

#222222

Supplementary Text

Text Secondary

#666666

Meta / Date

Text Tertiary

#333333

Mid-gray

Text on Dark

#ffffff

White on Black / Orange

SURFACE

Surface Light Gray

#d2d2d2

Page Body BG

Surface Hero

#000000

Hero / Top Area BG

Surface White

#ffffff

Card / Content Block

Surface Off-White

#f4f4f4

Light BG Variant

Surface Light Gray 2

#ededed

Section BG Variant

Surface Light Gray 3

#dbdbdb

Border / Divider

02 / TYPOGRAPHY

TYPOGRAPHY

Typography -- Tsukushi A Old Mincho (Shippori Mincho) + Futura LT Pro (Jost) / palt OFF / ls 3 levels

PICK UP

Jost (Futura LT Pro) / 28px / 500 / line-height: 1.0 / letter-spacing: 0.05em / color: #ff3300Section Title EN

lorem ipsum dolor〈lorem ipsum〉

Shippori Mincho (Tsukushi A Old Mincho) / 26px / 400 / line-height: 1.61 / letter-spacing: 0.125em / color: #ff3300Product Title JP

lorem ipsum dolor sit amet consectetur

Shippori Mincho (Tsukushi A Old Mincho) / 15px / 400 / line-height: 1.85 / letter-spacing: 0.15em / color: #000000News Title JP

PRODUCTS

Jost (Futura LT Pro) / 14px / 500 / line-height: 1.0 / letter-spacing: 0.02em / color: #ffffff on #ff3300CTA Button EN

Jost (Futura LT Pro) / 11px / 500 / line-height: 1.0 / color: #ff3300 + border-bottomCTA Link EN

STORE INFORMATION

Shippori Mincho (Tsukushi A Old Mincho Pr6 M) / 12px / 500 / line-height: 1.0Footer Label JP

lorem ipsum dolor sit amet consectetur, lorem ipsum dolor sit amet. lorem ipsum dolor, lorem ipsum dolor. lorem ipsum dolor sit amet consectetur, lorem ipsum dolor sit amet consectetur adipiscing elit sed.

Hiragino Kaku Gothic ProN / 14px / 400 / line-height: 1.85 / letter-spacing: 0.05emBody

lorem ipsum, lorem.

Shippori Mincho / 18px / 400 / line-height: 2.0 / letter-spacing: 0.15em / writing-mode: vertical-rlVertical Tagline

03 / ARTICLE

ARTICLE

Product Page Sample -- Luxury Confectionery

NEW ARRIVAL

PICK UP

lorem ipsum dolor〈lorem ipsum〉

lorem ipsum dolor sit amet consectetur, PRESS BUTTER SAND lorem ipsum dolor. lorem ipsum dolor sit, lorem ipsum dolor sit amet consectetur adipiscing elit sed. lorem ipsum dolor sit, lorem ipsum dolor sit amet consectetur adipiscing.

lorem ipsum dolor

INGREDIENTS

lorem ipsum dolor sit amet consectetur adipiscing elit sed. lorem ipsum dolor, lorem ipsum dolor sit amet consectetur adipiscing elit sed do eiusmod. lorem ipsum dolor sit amet consectetur adipiscing, lorem ipsum dolor sit amet consectetur.

2026.05.15

lorem ipsum dolor sit“lorem ipsum dolor&lorem ipsum”lorem ipsum dolor

2026.05.01

lorem ipsum dolor sit lorem ipsum dolor sit amet consectetur

PRODUCTS VIEW MORE

04 / BUTTONS

BUTTONS

Buttons -- radius 0px / sharp edges / #ff3300 filled CTA

PRODUCTS

Primary / filled #ff3300 / radius 0 / Jost 500

Secondary / text + underline #ff3300

STORE LIST

Nav Outline / 1px border / Jost 500

STORE

Nav Link / bg #d2d2d2 / radius 0

ON DARK BACKGROUND

PRODUCTS

Primary / #ff3300 on black

Secondary / #ff3300 text + underline

ONLINE SHOP

Outline / 1px white border

05 / CARDS

CARDS

Product Cards -- shadow none / radius 0 / flat

Product Image

NEW ARRIVAL

lorem ipsum dolor〈lorem ipsum〉

¥1,188

Product Image

PICK UP

lorem ipsum dolor〈lorem ipsum〉

¥1,296

Product Image

LIMITED

lorem ipsum dolor〈lorem〉

¥1,296

Product Image

GIFT