ホームページ > ウェブフロントエンド > jsチュートリアル > 16 進数のカラーコードを明るくしたり暗くしたりするには?

16 進数のカラーコードを明るくしたり暗くしたりするには?

DDD
リリース: 2024-11-08 05:06:01
オリジナル
209 人が閲覧しました

How to Lighten or Darken a Hex Color Code?

このコード サンプルは、16 進カラーを特定の量だけ明るくしたり暗くしたりできるプログラムを示しています。 「3F6D2A」などの文字列として 16 進数の色を指定したり、色を明るくしたり暗くしたりする量を表す整数を指定できます。

プログラムの仕組みは次のとおりです。

  1. 16 進数のカラー文字列を取得して整数に変換します。
  2. 整数は指定された量で調整されます。色を明るくするには正の値、暗くするには負の値を指定できます。
  3. 調整された整数は、色が有効範囲内に収まるように特定の式を使用して 16 進数の色文字列に変換されます。

色がどのように調整されるかを説明する簡略化されたコード スニペットを次に示します。調整が完了しました:

function LightenDarkenColor(col, amt) {
  col = parseInt(col, 16); // Convert hex color to integer
  col = col + amt; // Adjust the integer by the specified amount
  col = col.toString(16); // Convert the adjusted integer back to hex color
  return col;
}
ログイン後にコピー

提供された関数には、コードの複数のバージョンがあり、それぞれに若干の違いがあります。最も顕著な違いは、対数ブレンディングと線形ブレンディングを使用する関数の違いです。通常、対数ブレンドでは、線形ブレンドと比較して、より微妙で自然な色の調整が行われます。

プログラムを使用するには、目的の 16 進数の色と調整量を指定して LightenDarkenColor 関数を呼び出すことができます。たとえば、色「3F6D2A」を 40 明るくするには、次のように呼び出します。

LightenDarkenColor("3F6D2A", 40)
ログイン後にコピー

これにより、元の色より 40 単位明るい新しい 16 進数の色が返されます。

以上が16 進数のカラーコードを明るくしたり暗くしたりするには?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート