Color swatches
Grid experiment to display swatch palettes
<figure><img src="https://scottgruber.github.io/100-layouts/img/016/mrt-colors-14.jpg" alt="Santa Monica mountains">
<figcaption>
<p><b>Color palette 5</b></p>
<section class="palette">
<div class="swatch">
<div style="background: #68748C;"></div>
<div>
<p><b>Hex: </b>#68748C<br>
<b>HSL: </b>220° 15% 48%<br>
<b>RGB: </b>104 116 140</p>
</div>
</div>
<div class="swatch">
<div style="background: #6CA6D9;"></div>
<div>
<p> <b>Hex: </b>#6CA6D9<br>
<b>HSL: </b>208° 59% 64%<br>
<b>RGB: </b>108 166 217</p>
</div>
</div>
<div class="swatch">
<div style="background: #80BDF2;"></div>
<div>
<p><b>Hex: </b>#80BDF2<br>
<b>HSL: </b>208° 81% 73%<br>
<b>RGB: </b>128 189 242</p>
</div>
</div>
<div class="swatch">
<div style="background: #A7D5F2;"></div>
<div>
<p><b>Hex: </b>#A7D5F2<br>
<b>HSL: </b>203° 74% 80%<br>
<b>RGB: </b>167 213 242</p>
</div>
</div>
<div class="swatch">
<div style="background: #A68A7B;"></div>
<div>
<p><b>Hex: </b>#A68A7B<br>
<b>HSL: </b>21° 19% 57%<br>
<b>RGB: </b>166 138 123</p>
</div>
</div>
</section>
</figcaption>
</figure>