RadialHero

放射状の幾何学グラフィックを中央に大きく置き、その上に巨大なタイポグラフィを重ねる、全画面写真を使わないヒーローの解説です。

Diagonal

右下がりの斜めの線で背景色を切り替え、深紅の色面と文字を左に、線画の幾何学グラフィックを右に置く、斜め分割の構成の解説です。

Card Section

カード構成01

太い枠線のブロックに、アイコンと短い説明を置く構成の解説です。

カード構成02

ホバーで枠の色が面になり、上へ浮き上がります。

カード構成03

3つ目は塗りつぶしにして、視線の起点にします。

カード構成04

アイコンはホバーで少し回転しながら大きくなります。

Data Section

99.8%
Metric 01
050100
3.6x
Metric 02
02x4x
84%
Metric 03

CTA Section

斜めに分けた2色の面に、大きな数字と枠線だけのボタンを置く、ページ終端の構成の解説です。

Contact