Cafi Netつながる情報技術
  1. トップ>
  2. アメブロカスタマイズ>
  3. webセーフカラー

webセーフカラーの一覧（色見本）

webセーフカラー（ウェブセーフカラー）（OSやウェブブラウザなど閲覧環境の影響なく正しく表示できる216色）の一覧（色見本）です。コピー＆ペーストでお使いください。

#000000

#000033

#000066

#000099

#0000CC

#0000FF

#003300

#003333

#003366

#003399

#0033CC

#0033FF

#006600

#006633

#006666

#006699

#0066CC

#0066FF

#009900

#009933

#009966

#009999

#0099CC

#0099FF

#00CC00

#00CC33

#00CC66

#00CC99

#00CCCC

#00CCFF

#00FF00

#00FF33

#00FF66

#00FF99

#00FFCC

#00FFFF

#330000

#330033

#330066

#330099

#3300CC

#3300FF

#333300

#333333

#333366

#333399

#3333CC

#3333FF

#336600

#336633

#336666

#336699

#3366CC

#3366FF

#339900

#339933

#339966

#339999

#3399CC

#3399FF

#33CC00

#33CC33

#33CC66

#33CC99

#33CCCC

#33CCFF

#33FF00

#33FF33

#33FF66

#33FF99

#33FFCC

#33FFFF

#660000

#660033

#660066

#660099

#6600CC

#6600FF

#663300

#663333

#663366

#663399

#6633CC

#6633FF

#666600

#666633

#666666

#666699

#6666CC

#6666FF

#669900

#669933

#669966

#669999

#6699CC

#6699FF

#66CC00

#66CC33

#66CC66

#66CC99

#66CCCC

#66CCFF

#66FF00

#66FF33

#66FF66

#66FF99

#66FFCC

#66FFFF

#990000

#990033

#990066

#990099

#9900CC

#9900FF

#993300

#993333

#993366

#993399

#9933CC

#9933FF

#996600

#996633

#996666

#996699

#9966CC

#9966FF

#999900

#999933

#999966

#999999

#9999CC

#9999FF

#99CC00

#99CC33

#99CC66

#99CC99

#99CCCC

#99CCFF

#99FF00

#99FF33

#99FF66

#99FF99

#99FFCC

#99FFFF

#CC0000

#CC0033

#CC0066

#CC0099

#CC00CC

#CC00FF

#CC3300

#CC3333

#CC3366

#CC3399

#CC33CC

#CC33FF

#CC6600

#CC6633

#CC6666

#CC6699

#CC66CC

#CC66FF

#CC9900

#CC9933

#CC9966

#CC9999

#CC99CC

#CC99FF

#CCCC00

#CCCC33

#CCCC66

#CCCC99

#CCCCCC

#CCCCFF

#CCFF00

#CCFF33

#CCFF66

#CCFF99

#CCFFCC

#CCFFFF

#FF0000

#FF0033

#FF0066

#FF0099

#FF00CC

#FF00FF

#FF3300

#FF3333

#FF3366

#FF3399

#FF33CC

#FF33FF

#FF6600

#FF6633

#FF6666

#FF6699

#FF66CC

#FF66FF

#FF9900

#FF9933

#FF9966

#FF9999

#FF99CC

#FF99FF

#FFCC00

#FFCC33

#FFCC66

#FFCC99

#FFCCCC

#FFCCFF

#FFFF00

#FFFF33

#FFFF66

#FFFF99

#FFFFCC

#FFFFFF

アメブロでセーフカラー活用

webセーフカラーの一覧（色見本）を利用して、アメーバブログ（アメブロ）をカスタマイズしていきます。

アメブロのカスタム可能デザインの CSS 編集画面

アメブロへログインし「ブログを書く」-「デザインの変更」へと進み、適用中のデザイン「カスタム可能ベーシック」の「CSSの編集」へと進みます。

カスタム可能デザインを選択していない方は、CSS の編集ができるようにカスタム可能デザインを適用してください。

アメブロのカラーナンバーを変更してカスタマイズする

CSS の中には、数多くのカラーナンバーの記載があります。変更したい箇所のカラーナンバーを、webセーフカラーの一覧（色見本）から選んだカラーナンバーにコピー＆ペーストで変更します。

かんたんCSS編集のカラーナンバーを変更

「かんたんCSS編集はこちら」にある設定項目の、ブログタイトルの文字色を変更する（header h1）・ブログ説明の文字色を変更する（header h2）・ページ全体の文字色を変更する・サイドバーの見出し文字色を変更するなどを全て、カラーナンバー「#FF0033」にコピー＆ペーストで変更し、表示を確認するをクリックすると上画像のように各パーツの文字色の変更が確認できます。

他にも「その他のCSS編集はこちらから」の「デザインカスタマイズ - ブログデザイン基本設定」からは、リンク色・訪問済みのリンク色・マウスオーバー時のリンク色などが変更できます。リンク色を変更することでも、かなりブログの印象が変わります。

CSS を編集前の状態に戻す

設定を始めからやり直したい場合は、「編集前の状態に戻す」をクリックすると CSS 編集前に戻ります。

「右クリック」-「取り消し」を繰り返すことでも、設定を元に戻すことが可能です。

表示を確認する（プレビュー）を利用して編集している場合、編集前の状態に戻すをクリックすれば戻りますが、「保存」した場合は CSS の設定は戻りません。

保存した CSS を初期状態に戻して再度編集したい場合は、「デザイン変更」-「カスタム可能」から再度「カスタム可能ベーシックを適用」して下さい。

全く同じカラム数を選ぶ場合は初期状態に戻りませんので、その場合は他のカラム数を適用してから再度同じカラム数のデザインを適用するか、他のテンプレートを一度適用した後に戻したいデザインを適用してください。