<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<div class="container">
<div class="row">
<div style="width:200px;background-color:#D14836;border:1px solid #999;border-radius:4px;padding:10px; margin:10px 5px">
<div style="padding-right:10px;padding-left:10px">
<a href="#" style="text-decoration:none" target="_blank"><span style="font-size:12px;font-family:Arial;font-weight:bold;color:#fff;white-space:nowrap;display:block; text-align:center">Google Red with White Text</span></a>
</div>
</div>
<div style="width:200px;background-color:#f1f1f1;border:1px solid #999;border-radius:4px;padding:10px; margin:10px 5px">
<div style="padding-right:10px;padding-left:10px">
<a href="#" style="text-decoration:none" target="_blank"><span style="font-size:12px;font-family:Arial;font-weight:bold;color:#444;white-space:nowrap;display:block; text-align:center">Gmail Gray with Black Text</span></a>
</div>
</div>
<div style=
"width:200px;background-color:#0370EA;border:1px solid #076BD2;border-radius:4px;padding:10px; margin:10px 5px">
<div style="padding-right:10px;padding-left:10px">
<a href="#" style="text-decoration:none" target="_blank"><span style=
"font-size:12px;font-family:Arial;font-weight:bold;color:#fff;white-space:nowrap;display:block; text-align:center">
Google Chrome Blue Button</span></a>
</div>
</div>
<div style=
"width:200px;background-color:#4D90FE;border:1px solid #3079ED;border-radius:4px;padding:10px; margin:10px 5px">
<div style="padding-right:10px;padding-left:10px">
<a href="#" style="text-decoration:none" target="_blank"><span style=
"font-size:12px;font-family:Arial;font-weight:bold;color:#fff;white-space:nowrap;display:block; text-align:center">
Google Blue Button</span></a>
</div>