Tbpgr Blog

Employee Experience Engineer tbpgr(てぃーびー) のブログ

HTML5新要素 input type="color"

概要

input type="color"タグについて説明します。

内容

input type="color"は色入力欄です。

サンプル

<!DOCTYPE HTML>
<html lang="ja-JP">
  <head>
    <meta charset="UTF-8" />
    <title>input type="color"</title>
  </head>
  <body>
  <form action="">
    color:<input type="color" name="color" id="color" value="#55ff55" />
    <input type="submit" name="" value="submit" />
  </form>
  </body>
</html>

完成画面のキャプチャ

現状だと、Opera以外はテキストボックスと変わらない表示なのでOperaのキャプチャです。

初期表示時

色選択時

その他の色選択時