Friday, September 16, 2016

Hexadecimal Color Sampler



This website that I made took awhile to make and I learned a lot of color coding from this. It took a lot of time see what codes were right and which were wrong.

Here is the code in TextMate for the website

<html>
<head>
<title> Hexidecimal Color Sampler</title>
<style type="text/css">
body{ /* you know what to do */
font-family:verdana;
background-color:#666;
}
div{
padding:12px;
border: solid thin #ffffff;
border-radius:20px;

}

</style>
</head>
<body>
<h1> Hexidecimal Color Sampler</h1>
<h2>#RRGGBB</h2>
<!--  Roy G Biv  -->

<div style="color:white;background-color:#CC0000;">
<strong>RED - #CC0000</strong>
</div>
<div style="color:white;background-color:#ee6600;">
<strong>Orange - #ee6600</strong>
</div>
<div style="color:white;background-color:#ffff00;">
<strong>YELLOW - #ffff00</strong>
</div>
<div style="color:white;background-color:#40ff00;">
<strong>GREEN - #40ff00</strong>
</div>
<div style="color:white;background-color:#0040ff;">
<strong>BLUE - #0040ff</strong>
</div>
<div style="color:white;background-color:#0000ff;">
<strong>INDIGO - #0000ff</strong>
</div>
<div style="color:white;background-color:#bf00ff;">
<strong>VIOLET - #bf00ff</strong>
</div>
Lighter Colors:
<div style="color:white;background-color:#ffcccc;">
<strong>PINK - #ffcccc</strong>
</div>
<div style="color:white;background-color:#fc9;">
<strong>pastel ORANGE - #e60</strong>
</div>
<div style="color:white;background-color:#fff68f;">
<strong>pastel YELLOW - #fff68f</strong>
</div>
<div style="color:white;background-color:#aeeeae;">
<strong>pastel GREEN - #aeeeae</strong>
</div>
<div style="color:white;background-color:#aaeeff;">
<strong>pastel BLUE - #aef</strong>
</div>
White, Black and shades of gray...
<div style="color:white;background-color:#000;">
<strong>BLACK - #000</strong>
</div>
<div style="color:white;background-color:#404040;">
<strong>darkest GRAY - #404040</strong>
</div>
<div style="color:white;background-color:#aaaaaa;">
<strong>medium GRAY - #aaaaaa</strong>
</div>
<div style="color:white;background-color:#eeeeee;">
<strong>light GRAY - #eeeeee</strong>
</div>
<div style="color:black;background-color:#ffffff;">
<strong>WHITE - #fff</strong>
</div>
</body>
</html>

No comments:

Post a Comment

Web Hosting Options

InMotion 1&1 Bluehost