lorem ipsum dolor.
lorem ipsum dolor, lorem ipsum dolor

DESIGN.md lorem ipsum dolor sit amet consectetur adipiscing. loft.co.jp lorem computed style lorem ipsum dolor.

lorem ipsum / lorem ipsum dolor sit amet lorem ipsum
01 / Colors

lorem ipsum dolor

Brand
LOFT Yellow
#fdd000
lorem ipsum dolor
Yellow Dark
#eba700
lorem ipsum / lorem
NEW Red
#e40012
NEW!! lorem
Neutral
Black
#000000
lorem ipsum dolor
Dark Gray
#333333
lorem ipsum
Mid Gray
#666666
lorem UI
Light Gray
#999999
lorem ipsum dolor
Border
#cccccc
lorem ipsum
Surface
White
#ffffff
lorem ipsum
Warm White
#fffbf4
lorem ipsum
Light Gray
#f4f4f4
lorem ipsum dolor
Footer Gray
#f1f1f1
lorem ipsum
Category
#f3f2db
lorem ipsum BG
Semantic
Danger
#e40012
Success
#00875a
Warning
#eba700
02 / Typography

lorem ipsum dolor sit

lorem ipsum dolor — H2 (18px/700)
18px / 700 / lh 1.0 / kernlorem ipsum dolor
lorem ipsum dolor — H2 (16px/700)
16px / 700 / lh 1.4 / kernlorem ipsum dolor
lorem ipsum dolor sit — H3 (14px/400)
14px / 400 / lh 1.4 / kernlorem ipsum dolor
lorem ipsum dolor — lorem ipsum dolor, lorem, lorem, lorem ipsum dolor, lorem ipsum dolor sit amet consectetur. lorem ipsum dolor sit amet consectetur adipiscing elit sed, lorem ipsum dolor sit amet consectetur, lorem ipsum dolor.
16px / 400 / lh 1.875 / kernlorem ipsum dolor
lorem ipsum dolor sit — lorem (12px/400)
12px / 400 / lh 1.3lorem ipsum dolor
2026.05.08 — Date (12px)
12px / 400 / lh 1.0 / color #999999lorem ipsum dolor
lorem ipsum dolor — Nav (14px/700)
14px / 700 / lh 1.0lorem ipsum
NEW!!lorem ipsum dolor — News (13px) + NEW Badge
badge: 11px / bg #e40012 / padding 2px | title: 13px / 400lorem ipsum dolor
03 / Article

lorem ipsum dolor

2026.05.08

lorem ipsum dolor sit amet — 2026 lorem ipsum dolor sit

lorem ipsum dolor sit amet. lorem ipsum“lorem ipsum”lorem ipsum dolor sit amet consectetur. lorem ipsum dolor sit amet consectetur, lorem ipsum dolor sit amet consectetur.

lorem ipsum dolor

lorem ipsum dolor sit amet consectetur, lorem ipsum dolor sit amet. lorem ipsum dolor sit amet consectetur. lorem ipsum dolor 200 lorem ipsum dolor sit amet consectetur adipiscing.

※ lorem ipsum dolor sit amet consectetur.

04 / Buttons

lorem ipsum dolor sit

lorem ipsum dolor sit amet
Primary / 12px bold / radius 5 / border #ccc
lorem ipsum dolor
Secondary / 11px / bg #eee / radius 3
lorem ipsum
Search / 12px / radius 3 / border #ccc
lorem ipsum dolor sit amet consectetur ＞
Link / 16px / border #a2a1ab / radius 0
05 / Cards

lorem ipsum dolor sit

Product Image

NEW!!lorem“lorem ipsum”lorem ipsum dolor

¥324(lorem)
2026.05.08
Product Image

lorem ipsum dolor sit 4&1 lorem ipsum

¥1,100(lorem)
2026.05.05
Product Image

lorem ipsum dolor meets lorem lorem ipsum dolor

¥1,650(lorem)
2026.04.28
Product Image

NEW!!UV lorem lorem ipsum dolor

¥2,200(lorem)
2026.05.07
06 / Forms

lorem ipsum dolor

Default / bg #e1e2e5 / radius 0 3px 3px 0
Focus / bg #fff / border 1px #333
lorem ipsum dolor
Error / border 1px #e40012
07 / Elevation

Depth & Elevation

Level 0: Flat
lorem — lorem(lorem ipsum dolor)

LOFT lorem ipsum dolor sit amet. box-shadow lorem ipsum dolor sit amet.

08 / Layout

lorem ipsum dolor & lorem ipsum

Spacing Scale
XS
4px
S
8px
M
16px
L
24px
XL
32px
XXL
48px
Border Radius
0px
Link Button
3px
Search / Tag
5px
Primary CTA
Content Width

Corporate: max-width 980px / Store: max-width 960px / 2-column layout (store)