rgba(10進) rgb(16進)変換ツール
top > rgba(10進) rgb(16進)変換ツール
使い方
黒枠のフォームに色指定数値を入力し、各ボタンをクリックすると、他フォームの色指定数値が変化します。
左は16進数値でR、G、B、を各2桁
右は16進数値でR、G、B、を各1桁で指定します。
基本動作は「16進数の6文字」と「10進数の値」に対して、「上下変換ボタン」で計算して表示します。
※3文字指定はおまけですので、この数値を変化させた時のみ、左向き矢印のボタンをクリックし、6文字指定の値を表示させる必要があります。
当然ですが、F00はff0000を簡略化した指定です。
ちなみに、原森は昔から、2桁指定時（要するに6文字）の場合、小文字で fb3d9e などと記述し、1桁3文字指定時は大文字で F00 等と記述する癖があったりします。ので、三文字に小文字で入力していても、勝手に大文字(uppercase)に変換してたりします。
RGBA(10進)指定はいつの頃からか指定できるようになっていたRGBの10進指定です。こちらはR、G、B、の値を0～255の10進数値で指定します。(各16進指定を10進化しただけですが…)
HTML5＆CSS3対応ブラウザがα値も指定できるようになりました。ツールの4つ目のフォームには「0～1.0」の値を指定し、上向き矢印の変換ボタンをクリックすると、左にあるサンプルの色が変化して確認できるようにしています。
スタイルプロパティのradioボタン
おまけのcssソース記述に表示したい色指定関連のプロパティを選択しするチェックボックスです。
リセットボタン
「リセット」をクリックすると、初期値に数値をリセットします。※単なるフォームのリセットなので、サンプルの色は変化しません。
cssソース記述作成
クリックすると、[出力ソース表示のテキストエリア]に cssソースを表示します。
値入れ替えサンプル
クリックすると、help用サブウインドウにRGB値を入れ替えた6つの色サンプルが表示されます。
1：RGBAの入力値、以下、入力値Rを0,Gを1,Bを2とすると、1:012、2:021、3:102、4:120、5:201、6:210のように入れ替えた色サンプルになります。
出力ソース表示のテキストエリア
[cssソース記述作成]をクリックすると、cssソースが表示されます。
初期状態は「ここにソースが表示されます」の文字が表示されています。
入力例
クリックすると、サンプル値がフォームに入力され、フォーカス（背景色が変化）しますので、対応するボタンをクリックすると、他フォームのデータが表示されます。
基本動作は「16進数の6文字」と「10進数の値」の上下変換ボタンです。
※3文字指定はおまけですので、この数値を変化させた時のみ、左向き矢印のボタンをクリックし、6文字指定の値を表示させる必要があります。
16進 フォームに値を入力
(16進)の6桁、又は3桁のフォームにサンプル値を入力し、フォーカスします。
10進 フォームに値を入力
(10進)のR、G、B、A、にサンプル値を入力し、α値のフォームにフォーカスします。
補色ボタン
補色ボタンクリックで左にある色の補色をカラーサンプルに表示します。
そのカラーサンプルをクリックすると、左側の色指定を補色カラーに変更します。
回転カラーサンプル
回転カラーサンプルをクリックすると、クリック位置の色を取得して左上の色に置き換えます。
回転カラーサンプルはセーフカラーの色チップ画像を拡大する形でブラウザお任せ仕様で作っています。（のでセーフカラーではなく、その間の色も飛び飛びに存在します）
回転動作ボタンは、
[0] 初期位置
[1] 0から右に90度回転
[2] 0から右に180度回転
[3] 0から右に270度回転
[4] 0から上に90度回転
[5] 0から下に90度回転
レベル指定ボタンは、セーフカラーを立体にしたときの深さです。回転カラーサンプルはセーフカラーのみではないのですが、元になっているカラーについては以下になります。
LEVEL0…6,9のみを使用した色
(#999999 、#669966)
LEVEL1…3,6,9,cを使用した色
(#9c639c 、#369cc9)
LEVEL2…0,3,6,9,c,fを使用した色
(#0369cf 、#ffcc00)
※数値の微調節は上のRGBAフォームの方で数値を書き換えて行う仕様です。
コピーライト
Copyright © Haramori Laboratory of Information Technology 2015 All rights reserved.