＼コピペでOK／イラスト背景の✩囲み枠✩blue dot 1

イラスト背景の囲み枠、blue dotです。
ちょっとポップにしたくて作ってみました。
✩使い方は簡単✩
コードをコピーして記事投稿の「HTML表示」に貼り付けるのみ。
メッセージボードにも使えます。
文字入力は「通常表示」で行ってください。
・シンプル
・角丸背景
・影付きシンプル
・影付き角丸
の4種類16パターンをご用意しました。

シンプル

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。

--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210330/10/kuweb/68/9d/p/o0640064014918298332.png);"><div style="background:rgba(255,255,255,0.85);padding:20px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div>

二重線枠

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。

--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210330/10/kuweb/68/9d/p/o0640064014918298332.png);"><div style="background:rgba(255,255,255,0.85);padding:5px;"><div style="border:4px double #eb6ea0;padding:20px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。

--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210330/10/kuweb/68/9d/p/o0640064014918298332.png);"><div style="background:rgba(255,255,255,0.85);padding:5px;"><div style="border:4px double #c1ab05;padding:20px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>

左右二重線枠

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。

--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210330/10/kuweb/68/9d/p/o0640064014918298332.png);"><div style="background:rgba(255,255,255,0.85);padding:5px;"><div style="border-left:4px double #eb6ea0;border-right:4px double #eb6ea0;padding:20px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。

--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210330/10/kuweb/68/9d/p/o0640064014918298332.png);"><div style="background:rgba(255,255,255,0.85);padding:5px;"><div style="border-left:4px double #c1ab05;border-right:4px double #c1ab05;padding:20px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>

角丸シンプル

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。

--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210330/10/kuweb/68/9d/p/o0640064014918298332.png);border-radius:10px;"><div style="background:rgba(255,255,255,0.85);padding:20px;border-radius:5px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div>

角丸二重線枠

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。

--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210330/10/kuweb/68/9d/p/o0640064014918298332.png);border-radius:10px;"><div style="background:rgba(255,255,255,0.85);padding:5px;border-radius:5px;"><div style="border:4px double #eb6ea0;padding:20px;border-radius:5px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。

--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210330/10/kuweb/68/9d/p/o0640064014918298332.png);border-radius:10px;"><div style="background:rgba(255,255,255,0.85);padding:5px;border-radius:5px;"><div style="border:4px double #c1ab05;padding:20px;border-radius:5px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>

イラスト影付き

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。

--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210330/10/kuweb/68/9d/p/o0640064014918298332.png);box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.85);padding:20px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div>

イラスト影付き+二重線枠

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。

--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210330/10/kuweb/68/9d/p/o0640064014918298332.png);box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.85);padding:5px;"><div style="border:4px double #eb6ea0;padding:20px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。

--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210330/10/kuweb/68/9d/p/o0640064014918298332.png);box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.85);padding:5px;"><div style="border:4px double #c1ab05;padding:20px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>

イラスト影付き+左右二重線

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。

--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210330/10/kuweb/68/9d/p/o0640064014918298332.png);box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.85);padding:5px;"><div style="border-left:4px double #eb6ea0;border-right:4px double #eb6ea0;padding:20px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。

--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210330/10/kuweb/68/9d/p/o0640064014918298332.png);box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.85);padding:5px;"><div style="border-left:4px double #c1ab05;border-right:4px double #c1ab05;padding:20px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>

イラスト影付き+角丸

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。

--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210330/10/kuweb/68/9d/p/o0640064014918298332.png);border-radius:10px;box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.85);padding:20px;border-radius:5px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div>

イラスト影付き+角丸二重線枠

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。

--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210330/10/kuweb/68/9d/p/o0640064014918298332.png);border-radius:10px;box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.85);padding:5px;border-radius:5px;"><div style="border:4px double #eb6ea0;padding:20px;border-radius:5px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。

--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210330/10/kuweb/68/9d/p/o0640064014918298332.png);border-radius:10px;box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.85);padding:5px;border-radius:5px;"><div style="border:4px double #c1ab05;padding:20px;border-radius:5px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>

↑Tシャツ作っています。ﾁﾗｯと覗いていただけたら、うれしいです

↑ココナラでヘッダーやSNS用の画像各種、承っています。

↑アメブロカスタマイズを承っています。