IKEA

中文（台灣）

https://www.ikea.com.tw/zh

白底黑字的電商首頁，標題全用粗黑體。按鈕和搜尋框都是膠囊形，藍色當主要按鈕、黃色當客服按鈕，促銷圖拼成大小不一的方格。

產業: 零售・電商; 家居・生活用品
網站類型: 電商網站
主色系: 黃; 藍
配色印象: 強調色突出
設計風格: 扁平; 圓角

顏色

primary
#0058A3
brand-yellow
#FFDB00
promo-blue
#007CC1
price-sale
#CA5008
on-primary
#FFFFFF
ink
#111111
text
#484848
placeholder
#ADB5BD
surface
#FFFFFF
surface-gray
#F5F5F5
border
#DFDFDF
on-ink
#FFFFFF
primary-focus
#004F93

字級

menu-display · Noto IKEA · 36px
Google Fonts 上沒有這個字型，用瀏覽器預設的字型顯示
The quick brown fox 敏捷的狐狸
page-title · Noto IKEA · 36px
Google Fonts 上沒有這個字型，用瀏覽器預設的字型顯示
The quick brown fox 敏捷的狐狸
price-lg · Noto IKEA · 28px
Google Fonts 上沒有這個字型，用瀏覽器預設的字型顯示
The quick brown fox 敏捷的狐狸
headline-lg · Noto IKEA · 28px
Google Fonts 上沒有這個字型，用瀏覽器預設的字型顯示
The quick brown fox 敏捷的狐狸
headline-md · Noto IKEA · 24px
Google Fonts 上沒有這個字型，用瀏覽器預設的字型顯示
The quick brown fox 敏捷的狐狸
headline-sm · Noto IKEA · 20px
Google Fonts 上沒有這個字型，用瀏覽器預設的字型顯示
The quick brown fox 敏捷的狐狸
title-md · Noto IKEA · 16px
Google Fonts 上沒有這個字型，用瀏覽器預設的字型顯示
The quick brown fox 敏捷的狐狸
body-md · Noto IKEA · 16px
Google Fonts 上沒有這個字型，用瀏覽器預設的字型顯示
The quick brown fox 敏捷的狐狸
body-sm · Noto IKEA · 14px
Google Fonts 上沒有這個字型，用瀏覽器預設的字型顯示
The quick brown fox 敏捷的狐狸
label-strong · Noto IKEA · 14px
Google Fonts 上沒有這個字型，用瀏覽器預設的字型顯示
The quick brown fox 敏捷的狐狸
label-bold · Noto IKEA · 12px
Google Fonts 上沒有這個字型，用瀏覽器預設的字型顯示
The quick brown fox 敏捷的狐狸
caption · Noto IKEA · 12px
Google Fonts 上沒有這個字型，用瀏覽器預設的字型顯示
The quick brown fox 敏捷的狐狸

圓角

sm
4px
md
10px
pill
160px
full
9999px

間距

xs
4px
sm
8px
md
12px
lg
24px
xl
48px
page-margin
108px

元件

promo-bar
utility-bar
search-field
search-field-placeholder
button-primary
button-primary-focus
add-to-cart-button
button-emphasis
button-secondary
detail-tab-button
icon-button-round
chat-button
text-link
text-link-hover
promo-card
product-card
product-price-sale
product-price
notice-box
breadcrumb
spec-table
filter-bar
section-title
page-heading
body-text
divider
mega-menu-item
category-card
headline-block