左側の写真
01 / Symmetry Hero

Symmetry Hero

中央の軸を挟んで、左右が鏡のように同じ配置になる構成の解説です。中央に見出しと説明文、左右にシダの葉の写真を1枚ずつ置き、右は左右を反転します。

Learn More
右側の写真(左右反転)
左側の写真
02 / Unfurl

Unfurl Reveal

写真の先端から順に、シダの葉が巻き解けるように現れる演出の解説です。clip-path を下から上へ開きます。

右側の写真(左右反転)
左側の写真
03 / Fractal Divider

Fractal Divider

見出しの上に、再帰的な葉の形の線画を細く置く区切りの解説です。線は左右対称で、中央の軸に向かって枝分かれします。

右側の写真(左右反転)
左側の写真
04 / Mirror Layout

Mirror Layout

章を重ねても、左右の配置を崩さず、中央の軸をそろえる構成の解説です。暗い背景に、写真の縁をぼかして溶け込ませます。

右側の写真(左右反転)
終端の背景に敷いた写真
05 / CTA Section

CTA Section

Contact