[JS]ユーザーの好みに合わせてRGBaでカラースキームを変更するスクリプト -RGBa layout

ウェブページのカラースキームをフレキシブルに変更するスクリプトをBuild Internet!から紹介します。

Flexible Color Schemes in Layouts with RGBa

デモではページ上部の「Change the color」から各カラーをクリックすると、そのカラースキームがページ全体に反映されるようになっています。

デモページ

カラースキームを適用するベースは背景と四つのエレメントで、上から順に、明るい、より明るい、暗い、より暗い、となっています。

デモページ：シンプル版

カラーの指定には通常のRGBやHexではなく、RGBaを使用しているのも大きな特徴です。最後の「a」は透明度を指定します。
スタイルシートには下記のように記述します。

CSS

スクリプトはjQueryのプラグインのため、実装にはjquery.jsが必要です。