簡単に文字の背景を蛍光ペン風に!コピペで使えるサンプルをまとめ!

CSSでデザインした コピペで使える 蛍光ペン風の文字背景のデザインサンプルです。

サンプルタグをコピーして、HTML編集画面に貼り付けてご利用してください。
 

 

デザインサンプル

※お好みのカラータイトルをクリックするとサンプルタグへ移動します。(↓)

タイトル 1 タイトル 5 タイトル 9 タイトル13
タイトル 2 タイトル 6 タイトル10 タイトル14
タイトル 3 タイトル 7 タイトル11 タイトル15
タイトル 4 タイトル 8 タイトル12 タイトル16

 


 


蛍光マーカー サンプル1 をコピーする
 
【サンプル1】のタグ(↓)

蛍光マーカー<span style="background-color:#161b1a; font-weight: bold; color: #ffffff;"> サンプル2 </span>をコピーする


 


蛍光マーカー サンプル2 をコピーする
 
【サンプル2】のタグ(↓)

蛍光マーカー<span style="background-color:#313d42; font-weight: bold; color: #ffffff;"> サンプル2 </span>をコピーする


 


蛍光マーカー サンプル3 をコピーする
 
【サンプル3】のタグ(↓)

蛍光マーカー<span style="background-color:#52646c; font-weight: bold; color: #ffffff;"> サンプル3 </span>をコピーする


 


蛍光マーカー サンプル4 をコピーする
 
【サンプル4】のタグ(↓)

蛍光マーカー<span style="background-color:#dbe0e3; font-weight: bold;"> サンプル4 </span>をコピーする


 


蛍光マーカー サンプル5 をコピーする
 
【サンプル5】のタグ(↓)

蛍光マーカー<span style="background-color:#990000; font-weight: bold; color: #ffffff;"> サンプル5 </span>をコピーする


 


蛍光マーカー サンプル6 をコピーする
 
【サンプル6】のタグ(↓)

蛍光マーカー<span style="background-color:#dc143c; font-weight: bold; color: #ffffff;"> サンプル6 </span>をコピーする


 


蛍光マーカー サンプル7 をコピーする
 
【サンプル7】のタグ(↓)

蛍光マーカー<span style="background-color:#ffa3d1; font-weight: bold;"> サンプル7 </span>をコピーする


 


蛍光マーカー サンプル8 をコピーする
 
【サンプル8】のタグ(↓)

蛍光マーカー<span style="background-color:#F8E0F1; font-weight: bold;"> サンプル8 </span>をコピーする


 


蛍光マーカー サンプル9 をコピーする
 
【サンプル9】のタグ(↓)

蛍光マーカー<span style="background-color:#e0ffff; font-weight: bold;"> サンプル9 </span>をコピーする


 


蛍光マーカー サンプル10 をコピーする
 
【サンプル10】のタグ(↓)

蛍光マーカー<span style="background-color:#02a4f5; font-weight: bold; color: #ffffff;"> サンプル10 </span>をコピーする

 


 


蛍光マーカー サンプル11 をコピーする
 
【サンプル11】のタグ(↓)

蛍光マーカー<span style="background-color:#40e0d0; font-weight: bold;"> サンプル11 </span>をコピーする


 


蛍光マーカー サンプル12 をコピーする
 
【サンプル12】のタグ(↓)

蛍光マーカー<span style="background-color:#00008b; font-weight: bold; color: #ffffff;"> サンプル12 </span>をコピーする


 


蛍光マーカー サンプル13 をコピーする
 
【タイトル13】のサンプルタグ(↓)

蛍光マーカー<span style="background-color:#ff4500; font-weight: bold; color: #ffffff;"> サンプル13 </span>をコピーする


 


蛍光マーカー サンプル14 をコピーする
 
【サンプル14】のタグ(↓)

蛍光マーカー<span style="background-color:#ff6347; font-weight: bold;"> サンプル14 </span>をコピーする


 


蛍光マーカー サンプル15 をコピーする
 
【サンプル15】のタグ(↓)

蛍光マーカー<span style="background-color:#F5D0A9; font-weight: bold;"> サンプル15 </span>をコピーする


 


蛍光マーカー サンプル16 をコピーする
 
【サンプル16】のタグ(↓)

蛍光マーカー<span style="background-color:#ffff00; font-weight: bold;"> サンプル16 </span>をコピーする