アメブロカスタマイズ ボタン オシャレな大人カラー

アメブロカスタマイズ ボタン オシャレな大人カラー

 

 

 大人っぽいきれいな色を選んでいます。

 目立つ色がベスト。   

 赤や濃いピンクなど、意思決定を促すものもありますし、安心感をもって押してしまうグリーン(LINEのような色)もあります!

 ご自身のブランディングに合い、かつ、目立つ色を、試してみてください。

 自分で色を変更していただくこともできます! 

 

 

アメブロカスタマイズ ボタンの形について

・丸いものは優しい雰囲気。
・角がキリっとしているのはきちんとした感じ。
・角に丸みを帯びているのは中間的な感じ。

 

アメブロカスタマイズ ボタンの色・装飾付について

 

・使いやすい上品なカラーを選びました。

・グラデーションボタンも用意しました。

・飾りのついたボタンも用意しました。

・ご自分で色の変更もしていただけます。

参考▶https://www.colordic.org/

 

丸みのあるボタン/アメブロカスタマイズ ボタン オシャレな大人カラー

 

ボタン① ピンク・影あり・丸みのあるボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#ff8080;border-radius:25px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン② 大人ラベンダー・影あり・丸みのあるボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#db7093;border-radius:25px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン③ アクアマリン・影あり・丸みのあるボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#66cdaa;border-radius:25px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン④ ヒヤシンスブルー・影あり・丸みのあるボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#7a99cf;border-radius:25px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑤ ロイヤルブルー・影あり・丸みのあるボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#4169e1;border-radius:25px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑥ こっくりグレー・影あり・丸みのあるボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#708090;border-radius:25px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑦ 菜の花イエロー・影あり・丸みのあるボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#595857; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#ffec47;border-radius:25px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑧ サーモンピンク・影あり・丸みのあるボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#595857; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#f3a68c;border-radius:25px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑨ ゴールド調・影あり・丸みのあるボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#bfa469;border-radius:25px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

ボタン ⑩パンジーネイビー・影あり・丸みのあるボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#4d4398;border-radius:25px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

 

きりっとしたボタン/アメブロカスタマイズ ボタン オシャレな大人カラー

 

ボタン① ピンク・影あり・きりっとしたボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#ff8080;border-radius:0px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン② 大人ラベンダー・影あり・きりっとしたボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#db7093;border-radius:0px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン③ アクアマリン・影あり・きりっとしたボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#66cdaa;border-radius:0px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン④ ヒヤシンスブルー・影あり・きりっとしたボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#7a99cf;border-radius:0px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑤ ロイヤルブルー・影あり・きりっとしたボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#4169e1;border-radius:0px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑥ こっくりグレー・影あり・きりっとしたボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#708090;border-radius:0px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑦ 菜の花イエロー・影あり・きりっとしたボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#595857; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#ffec47;border-radius:0px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑧ サーモンピンク・影あり・きりっとしたボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#595857; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#f3a68c;border-radius:0px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑨ ゴールド調・影あり・きりっとしたボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#bfa469;border-radius:0px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

ボタン ⑩パンジーネイビー・影あり・きりっとしたボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#4d4398;border-radius:0px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

 

中間的な角に丸みを帯びたボタン/アメブロカスタマイズ ボタン オシャレな大人カラー

ボタン① ピンク・影あり・中間的なボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#ff8080;border-radius:7px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン② 大人ラベンダー・影あり・中間的なボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#db7093;border-radius:7px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン③ アクアマリン・影あり・中間的なボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#66cdaa;border-radius:7px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン④ ヒヤシンスブルー・影あり・中間的なボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#7a99cf;border-radius:7px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑤ ロイヤルブルー・影あり・中間的なボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#4169e1;border-radius:7px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑥ こっくりグレー・影あり・中間的なボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#708090;border-radius:7px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑦ 菜の花イエロー・影あり・中間的なボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#595857; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#ffec47;border-radius:7px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑧ サーモンピンク・影あり・中間的なボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#595857; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#f3a68c;border-radius:7px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑨ ゴールド調・影あり・中間的なボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#bfa469;border-radius:7px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

ボタン ⑩パンジーネイビー・影あり・中間的なボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#4d4398;border-radius:7px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

 

ステッチ風の角ボタン/アメブロカスタマイズ ボタン オシャレな大人カラー

ボタン① ピンク・中間的なボタン

お申込はこちらをクリック

このコードをコピー&ペーストして使う

<a href="リンク先のアドレス" style="color:#ffffff; font-weight:bold; text-decoration:none; line-height:5.0;margin:3px 10px; padding:15px 35px; background:#ff8080;border-radius:0px; box-shadow: 0px 0px 0px 10px #ff8080; border: dashed 2px #ffffff;" target="_blank"><span style="">お申込はこちらをクリック</span></a>

 

 

斜線がおしゃれな角ボタン/アメブロカスタマイズ ボタン オシャレな大人カラー

ボタン① ピンク・中間的なボタン

 
お申込はこちらをクリック
 

このコードをコピー&ペーストして使う

<a href="リンク先のアドレス" style="color:#ffffff; font-weight:bold; margin:10px 0; padding:25px 48px; background: -webkit-repeating-linear-gradient(-45deg, #ff8080, #ff8080 3px,#FFA9BB 3px, #FFA9BB 7px);
background: repeating-linear-gradient(-45deg, #ff8080, #ff8080 3px,#FFA9BB 3px, #FFA9BB 7px);" target="_blank"><span style="">お申込はこちらをクリック</span></a>

 

 

プレート風角丸ボタン/アメブロカスタマイズ ボタン オシャレな大人カラー

ボタン① ピンク・中間的なボタン

 
●  お申込はこちらをクリック  ●
 

このコードをコピー&ペーストして使う

<a href="リンク先のアドレス" style="color:#ffffff; font-weight:bold; margin:10px 0; padding:25px 20px; background: #ff8080; vertical-align: middle; border-radius: 15px ;" target="_blank"><span style="">●  お申込はこちらをクリック  ●</span></a>

 

 

付箋風角ボタン/アメブロカスタマイズ ボタン オシャレな大人カラー

ボタン① ピンク・中間的なボタン

 
お申込はこちらをクリック
 

このコードをコピー&ペーストして使う

<a href="リンク先のアドレス" style="color:#ffffff; font-weight:bold; margin:10px 0; padding:25px 40px; background: #ff8080; border-left: solid 8px #FFA9BB; border-bottom: solid 4px #d7d7d7;" target="_blank">お申込はこちらをクリック</a>

 

 

縦グラデーション角ボタン/アメブロカスタマイズ ボタン オシャレな大人カラー

ボタン① ピンク・中間的なボタン

 
お申込はこちらをクリック
 

このコードをコピー&ペーストして使う

<a href="リンク先のアドレス" style="color:#ffffff; font-weight:bold; text-shadow: 0 0 5px #C62128; margin:10px 0; padding:25px 45px; position: relative; background: -webkit-linear-gradient(to right, #ff8080, #F2D1CE); background: linear-gradient(to right, #ff8080, #F2D1CE);
" target="_blank">お申込はこちらをクリック</a>

 

 

横グラデーション角ボタン/アメブロカスタマイズ ボタン オシャレな大人カラー

ボタン① ピンク・中間的なボタン

 
お申込はこちらをクリック
 

このコードをコピー&ペーストして使う

<a href="リンク先のアドレス" style="color:#ffffff; font-weight:bold; text-shadow: 0 0 5px #C62128; margin:10px 0; padding:25px 45px; position: relative; background: -webkit-linear-gradient(to top, #ff8080, #F2D1CE); background: linear-gradient(to top, #ff8080, #F2D1CE);
" target="_blank">お申込はこちらをクリック</a>

 

 

楕円形ボタン/アメブロカスタマイズ ボタン オシャレな大人カラー

ボタン① ピンク・中間的なボタン

 
お申込はこちらをクリック
 

このコードをコピー&ペーストして使う

<a href="リンク先のアドレス" style="color:#ffffff; font-weight:bold; display: inline-block; text-decoration: none; background: #ff8080; width: 220px; height: 100px;
line-height:100px; border-radius: 50%; text-align: center; overflow: hidden;" target="_blank">お申込はこちらをクリック</a>

Copyright© 女性起業家の想いを伝え実現するーMeRaise-ミライズ , 2020 All Rights Reserved.