演出・リッチ
オーロラ・メッシュ背景
ゆっくり漂う光の塊が溶け合う、オーロラ風のアニメ背景。WebGL不要、ぼかした放射グラデだけで作るリッチなヒーロー背景。
プレビュー
自動再生
操作自動で再生されます。
実装メモ
色の塊は ::before / ::after の radial-gradient を blur+translate で動かしています。色を変えるだけで雰囲気が一変します。ヒーローセクションの背景に敷いて、上にテキストを重ねてください。
コード（コピーして使えます）
<div class="aurora">
<span class="aurora-blob aurora-blob-3"></span>
<div class="aurora-content">
<p class="aurora-title">Aurora</p>
<p class="aurora-sub">純CSSの動くメッシュ背景</p>
</div>
</div>