Webサイトの背景に動画を流したりするケースが見られますが、動画はサイズが大きくなりがちです。もっと軽量で、見た目のインパクトがある方法もあるでしょう。そのためにはJavaScriptで動的に作り出す方法が考えられます。 今回はその一つの方法として、Ambient Canvas Backgroundsを紹介します。Canvasを使い、背景を動かします。

Ambient Canvas Backgroundsの使い方

オーロラというテーマです。

渦巻き。

シフト。

合体。

パイプライン。

Ambient Canvas BackgroundsはJavaScriptで作っているので軽量に動きます。動的に作り出されているので多少のランダム性もあります。インパクトが強いので、効果的に使ってみたいライブラリです。

Ambient Canvas BackgroundsはJavaScript製のソフトウェア（ライセンスは独自）です。

Ambient Canvas Backgrounds | Pipeline | Codrops crnacura/AmbientCanvasBackgrounds: Five ambient webpage backgrounds created using the HTML5 Canvas API and jwagner’s Simplex Noise library.