3

私はウェブサイトを作成していて、CSSを整理するためにSASS / Compassを使用することを楽しんでいるので、自分のウェブサイトをそれらに利用できるようにすることを思いつきました。

最初は、テーマパレットの色を表す8つの変数のセットを単純に作成することを考えていました。次に、すべてのCSSルールは、それらの色、またはその明るい/暗いバージョン（シャドウ、オーバーレイ、グラデーション、およびグロー用）を使用します。

それから私は単一のテーマのベースカラーを持つというクレイジーなアイデアに行き着きました。その後、パレットの残りの部分はそれから計算されます。例えば：

ここに画像の説明を入力してください

このツールでは、単一の基本色（円の内側の緑）を選択し、その後、それに基づいてフルカラーパレットを生成しました（右を参照）。この場合、これは「アナロジック」の配色です。

私の質問は、このツールで使用されているアルゴリズムをSASSで複製できるかどうかです。これにより、SASSが残りの配色を計算しながら、単一の構成可能な色を使用できます。

この演習の有用性を疑う方もいらっしゃるかもしれませんが、楽しい実験だと思います。

4

2 に答える 2

2

一つには、そのカラーホイールは正しくありません。赤の補色は緑ではなくシアンです。また、正しい用語は「アナロジック」ではなく「アナロジック」です。個人的にはこのウェブサイトの方がいいと思います。

基本的な類似の配色を作成するには、最初に必要なのは、HSL（または同様の色相ベース）形式との間で色を変換する方法です。これがあると仮定すると、類似の3色スキームの基本的なアルゴリズムは次のとおりです。

Inputs: BaseColor, HueVariation

Color1 = BaseColor
Color2 = ColorFromHSL(Hue(BaseColor) + HueVariation, Saturation(BaseColor), Lightness(BaseColor))
Color3 = ColorFromHSL(Hue(BaseColor) - HueVariation, Saturation(BaseColor), Lightness(BaseColor))

ウィキペディアにはより多くの情報があります。

于 2012-06-14T22:08:13.763 に答える
1

あなたが探しているのは色の調和です。このようなハーモニーを生成するのに役立つ事前定義されたスキームがたくさんあります。通常、これらはRGB色空間ではなくHSL色空間に基づいています。

使用できるリンクは次のとおりです。

http://www.tigercolor.com/color-lab/color-theory/color-harmonies.htm

http://sputnik.freewisdom.org/lib/colors/

また、他のスキームをグーグルで検索してみたくなるかもしれません。

ほとんどの場合、スキームは指定された入力色で機能するため、ある色のカスタムスキームを作成して、別の色のセットに適用できる場合があります。

于 2012-06-14T21:26:14.733 に答える