www.htmlcsscolor.com
Open in
urlscan Pro
205.144.171.63
Public Scan
URL:
https://www.htmlcsscolor.com/
Submission: On October 27 via manual from BE — Scanned from DE
Submission: On October 27 via manual from BE — Scanned from DE
Form analysis 1 forms found in the DOM
POST ./
<form method="post" action="./" id="frmMain" enctype="multipart/form-data">
<div class="aspNetHidden">
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="">
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="">
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE"
value="/wEPDwUKLTk3OTg2MTkzNA9kFgJmD2QWBAIBD2QWBAIDDxYCHgdjb250ZW50BV1jb2xvciwgY29sb3VyLCBjb2xvciBjb2RlLCBoZXggY29sb3IsIHJnYiBjb2xvciwgY29sb3IgY2hhcnQsIGNvbG9yIHdoZWVsLCBkZXNpZ24sIHdlYiBkZXNpZ25kAgQPFgIfAAWjATE2Nzc3MjE2IENvbG9ycyEgT25saW5lIGNvbG9yIGxpYnJhcnkgYW5kIGNvbG9yIHRvb2xzIGZvciBkZXZlbG9wZXJzLCBjb2RlcnMsIHdlYi1kZXNpZ25lcnM7IEZvciBwaG90b3Nob3AgYW5kIGFydC4gQW55IGNvbG9yIHNwYWNlczogSEVYLCBSR0IsIENNWUssIEhTTCwgSFNWIGV0Yy5kAgMPZBYCAgEPZBYIAgMPZBYEAgUPD2QWAh4Fc3R5bGUFJWJhY2tncm91bmQtY29sb3I6IzkzQzU0Qjtjb2xvcjpCbGFjaztkAgcPDxYCHgtOYXZpZ2F0ZVVybAULL2hleC85QTU5QkIWAh8BBSViYWNrZ3JvdW5kLWNvbG9yOiM5M0M1NEI7Y29sb3I6QmxhY2s7ZAIFD2QWAgIBDxYCHglpbm5lcmh0bWwFT0hUTUwgQ1NTIENvbG9yIFBpY2tlcjxzbWFsbCBjbGFzcz0icHVsbC1yaWdodCI+UkdCIEhFWCBDTVlLIEhTQiBIU1YgSFNMPC9zbWFsbD5kAgkPZBYEAhEPDxYCHghJbWFnZVVybAUlL2dyYWRpZW50LWxpbmVhci85QTU5QkIvdG8vQzdCRDEyLnBuZ2RkAhMPDxYCHgRUZXh0BQpjb3VudDogMTQwZGQCCw9kFgICAQ8PFgIfBQUJMjAxNC0yMDIyZGQYAQUeX19Db250cm9sc1JlcXVpcmVQb3N0QmFja0tleV9fFgEFJGN0bDAwJHVzY01lbnUkdXNjQWR2RG9uYXRlJGltZ0RvbmF0ZVK/2HwvYaVrT3448qV+WCwImTrIi8NwAbQVHT+s9KZf">
</div>
<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['frmMain'];
if (!theForm) {
theForm = document.frmMain;
}
function __doPostBack(eventTarget, eventArgument) {
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
}
//]]>
</script>
<script src="/WebResource.axd?d=8iycydZRmcbHiKdALYAbNIObFoVaVKr6QiOhzITLnmxbPQdcdt4GD7xTyUIbpsON1CuVMskkk4GC2k-Z8JvabGf3jxHkT8qfIxjnAn_-p_w1&t=637814372020000000" type="text/javascript"></script>
<script src="/ScriptResource.axd?d=fBW0cOhGK3VC9m5gzFcVQ6hKPMAo3d94Jp_33Jm-TvKKaYlEyww34M40IHLu5dmp0cTHTHCUSpnZhmn7rqCnVgNYZPKjbSFzBN-rs2Hh4YAi6_4ta9Tl8g8e5wm6IFxId_Ly8np5gm8SvEE-uZqUBdDddM989mo8lOQTW83NNwg1&t=49337fe8" type="text/javascript">
</script>
<script src="/ScriptResource.axd?d=GcMzW6mIMl3Q9whdFJezBrMY2Ydu89Ypu-X10Pyg8eOx7LjmDRCC79e8ZthZvQgPHd6voF3MUWQLCkZRoG3fpV1tezIANdJt5bKsD9wG-terWMOHTqSAP7DH-f8fV1svGRp8u9XHy5QJFQpg-QOi99LMfYD04l5TbETXdrBQXnKbY8ILj2gCKGV74tWP9Xqr0&t=49337fe8"
type="text/javascript"></script>
<div class="aspNetHidden">
<input type="hidden" name="__VIEWSTATEGENERATOR" id="__VIEWSTATEGENERATOR" value="CA0B0334">
<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION"
value="/wEdAAkZBYxzJEuKKh/hXDsWg64f25xgLlnJjr3lfYNAtV9WVFN83DafkrsWfpuMcP46emsOSdtS/HzcHhr6gM26GwBv8TdQ63eFZ6TJH1lsxHxoyh4ac+PQogE/y1KfFQML61ihHFU4VkunatM7xtS8C0kpVbHnf/ibvQpfJfcgkgGsmBO0AhOy3xUJAWr+N6byqheO1AG7REPJn7mDQqfGREgNsqGQTH2lR8OG0tV+xvnC9Q==">
</div>
<script type="text/javascript">
//<![CDATA[
Sys.WebForms.PageRequestManager._initialize('ctl00$ctl11', 'frmMain', [], [], [], 90, 'ctl00');
//]]>
</script>
<div class="navbar navbar-default navbar-fixed-top">
<div class="container mainpanel">
<div class="navbar-inner">
<div class="navbar-header">
<a class="navbar-brand" href="/"><strong>Color picker:</strong></a>
</div>
<div class="collapse navbar-collapse">
<div class="navbar-form navbar-left top3px">
<div class="form-group">
<input name="ctl00$uscMenu$txtSearch" type="text" value="#93C54B" id="uscMenu_txtSearch" class="form-control colorvalue" placeholder="hex, rgb, name" style="width:121px;">
<input name="ctl00$uscMenu$txtPicker" type="text" value="#93C54B" id="uscMenu_txtPicker" class="form-control colorpicker" style="width: 50px; display: none;">
<div class="sp-replacer sp-light">
<div class="sp-preview">
<div class="sp-preview-inner" style="background-color: rgb(147, 197, 75);"></div>
</div>
<div class="sp-dd">▼</div>
</div>
<input type="submit" name="ctl00$uscMenu$butSearch" value="Info" onclick="javascript:ColorSetHex();" id="uscMenu_butSearch" class="btn btn-success" style="background-color:#93C54B;color:Black;">
<a id="uscMenu_butRandom" class="btn btn-success rnd_button" href="/hex/9A59BB" style="background-color:#93C54B;color:Black;">Random</a>
</div>
</div>
<ul class="nav navbar-nav " role="menu">
<li class="divider_main">
</li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Tools <b class="caret"></b></a>
<ul class="dropdown-menu">
<li class="dropdown-header">Main</li>
<li><a href="/">Color home page</a></li>
<li><a href="/#wheel">Color wheel</a></li>
<li><a href="/color-gradient">Gradient generator</a></li>
<li class="divider"></li>
<li class="dropdown-header">Sets</li>
<li><a href="/web-safe-colors">Web safe colors</a></li>
<li><a href="/html-color-names">HTML & CSS Named colors</a></li>
<li><a href="/color-names-rgb-values/A">Color names RGB values</a></li>
<li><a href="/random-colors">Random colors</a></li>
<li class="divider"></li>
<li class="dropdown-header">Links</li>
<li><a target="_blank" rel="nofollow" href="/themes-templates">Themes & templates</a></li>
</ul>
</li>
<li>
<a href="/contacts">Contacts</a>
</li>
</ul>
<div class="navbar-form navbar-right">
<input type="image" name="ctl00$uscMenu$uscAdvDonate$imgDonate" id="uscMenu_uscAdvDonate_imgDonate" alt="PayPal – The safer, easier way to pay online." src="https://www.paypalobjects.com/en_GB/i/btn/btn_donate_SM.gif"
style="padding-top:14px">
</div>
</div>
</div>
</div>
</div>
<div class="container mainpanel maincontent">
<div class="page-header" style="padding-top:15px">
<h1 id="uscBootStrapHeader_lblTitle">HTML CSS Color Picker<small class="pull-right">RGB HEX CMYK HSB HSV HSL</small></h1>
</div>
<div id="pnlDonate" class="alert alert-dismissable alert-success alerttext" style="margin-bottom:20px;font-size:18px">
<a id="butClose" class="close" href="javascript:__doPostBack('ctl00$butClose','')" style="font-size:20px;text-decoration:none;">x</a>
<strong>Did you like it?</strong> Well, then please consider making a <b><a id="lnkDonate" href="javascript:__doPostBack('ctl00$lnkDonate','')">donation</a></b> :) <br><br>
<p class="small">This small site is a result of a hard-working process of one person. Server and domain have been paid with my own funds. All new feature development occasionally happens in the after-work hours only and driven by its owner's
desperate passion. If you do like this site or it has helped you by any means, you can support this resource financially in any possible way you prefer. All funds will be immediately invested in the future support and new feature development.
Thank you a lot and May the Force be with you!</p>
</div>
<h2>Welcome<small class="pull-right">Color Picker, Color Wheel and all about Color!</small></h2>
<div id="cntMain_pnlMain" style="float:left">
<div id="cntMain_pnlInfo" class="colorinfo" style="width:630px">
<p class="main">Free online <b>Color</b> (USA) or <b>Colour</b> (British) tools: information, gradient generator, color wheels etc.</p>
<p class="main">Creating a unique and what is very essential recognizable site, it's necessary to take into account the major factor – the <b>color</b> (or <b>colour</b>, British). The success or vice versa the failure of the <b>site</b>
depends on the competently chosen <b>color scheme</b>. <b>Color</b> is the most powerful and the most complicated element of the psychological impact. That's why the scrutiny of the issue is the process of the great importance.</p>
<p class="main"><b>Color</b> is the result of the combination of three components: <i>the source of light</i>, <i>the object</i> and <i>the observer</i>. Every color or the <b>combinations of the colors</b> are perceived differently: visually
and psychically, emotionally and psychologically. It is undeniable fact that any <b>web designer</b>, working with the color, is guided by the subjective perception. One should remember the <b>color blend</b> is neatly selected by an
expert.</p>
<p class="main">To avoid reinventing the wheel it is worth knowing and using the rules already in existence. Here are the basic concepts. Read <a href="#color_information">more</a> information.</p>
</div>
</div>
<div id="cntMain_pnlAd1" class="pull-right">
<div style="width:338px;height:280px;">
<div class="pull-right">
<script async="" src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- HtmlCssColor.com-336x280 -->
<ins class="adsbygoogle" style="display:inline-block;width:336px;height:280px" data-ad-client="ca-pub-6204451860372322" data-ad-slot="4861652174" data-adsbygoogle-status="done" data-ad-status="filled">
<div id="aswift_0_host" tabindex="0" title="Advertisement" aria-label="Advertisement"
style="border: none; height: 280px; width: 336px; margin: 0px; padding: 0px; position: relative; visibility: visible; background-color: transparent; display: inline-block;"><iframe id="aswift_0" name="aswift_0"
style="left:0;position:absolute;top:0;border:0;width:336px;height:280px;" sandbox="allow-forms allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts allow-top-navigation-by-user-activation" width="336"
height="280" frameborder="0" marginwidth="0" marginheight="0" vspace="0" hspace="0" allowtransparency="true" scrolling="no"
src="https://googleads.g.doubleclick.net/pagead/ads?client=ca-pub-6204451860372322&output=html&h=280&slotname=4861652174&adk=1804281601&adf=4156549901&pi=t.ma~as.4861652174&w=336&lmt=1666909633&format=336x280&url=https%3A%2F%2Fwww.htmlcsscolor.com%2F&wgl=1&uach=WyIiLCIiLCIiLCIiLCIiLFtdLGZhbHNlLG51bGwsIiIsW10sZmFsc2Vd&dt=1666909632983&bpp=7&bdt=540&idt=110&shv=r20221026&mjsv=m202210170101&ptt=9&saldr=aa&abxe=1&correlator=1395664366011&frm=20&pv=2&ga_vid=1642179467.1666909633&ga_sid=1666909633&ga_hid=2094706188&ga_fc=0&u_tz=0&u_his=2&u_h=1200&u_w=1600&u_ah=1200&u_aw=1600&u_cd=24&u_sd=1&dmc=8&adx=948&ady=388&biw=1600&bih=1200&scr_x=0&scr_y=0&eid=44759875%2C44759926%2C44759842%2C42531706%2C44775016%2C31060047&oid=2&pvsid=3305656810576298&tmod=31219269&uas=0&nvt=1&eae=0&fc=896&brdim=0%2C0%2C0%2C0%2C1600%2C0%2C1600%2C1200%2C1600%2C1200&vis=1&rsz=%7C%7CleE%7C&abl=CS&pfx=0&fu=0&bc=31&ifi=1&uci=a!1&fsb=1&xpc=uGQs1CzMWw&p=https%3A//www.htmlcsscolor.com&dtd=126"
data-google-container-id="a!1" data-google-query-id="CLbGu6S6gfsCFUqDgwcdE4ABSw" data-load-complete="true"></iframe></div>
</ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
</div>
</div>
<div class="clearfix"></div>
<hr>
<!-- Buttons -->
<div class="btn-group btn-group-justified">
<a href="/html-color-names" class="btn btn-success">HTML named colors</a>
<a href="/color-names-rgb-values/A" class="btn btn-success">RGB colors</a>
<a href="/web-safe-colors" class="btn btn-success">Web safe colors</a>
<a href="/random-colors" class="btn btn-success">Random colors</a>
<a href="/color-gradient" class="btn btn-success">Gradient</a>
</div>
<div class="clearfix"></div><br>
<script async="" src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- HtmlCssColor.com-970x90 -->
<ins class="adsbygoogle" style="display:inline-block;width:970px;height:90px" data-ad-client="ca-pub-6204451860372322" data-ad-slot="2268112571" data-adsbygoogle-status="done" data-ad-status="filled">
<div id="aswift_1_host" tabindex="0" title="Advertisement" aria-label="Advertisement"
style="border: none; height: 90px; width: 970px; margin: 0px; padding: 0px; position: relative; visibility: visible; background-color: transparent; display: inline-block;"><iframe id="aswift_1" name="aswift_1"
style="left:0;position:absolute;top:0;border:0;width:970px;height:90px;" sandbox="allow-forms allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts allow-top-navigation-by-user-activation" width="970" height="90"
frameborder="0" marginwidth="0" marginheight="0" vspace="0" hspace="0" allowtransparency="true" scrolling="no"
src="https://googleads.g.doubleclick.net/pagead/ads?client=ca-pub-6204451860372322&output=html&h=90&slotname=2268112571&adk=2434431270&adf=1891038679&pi=t.ma~as.2268112571&w=970&lmt=1666909633&format=970x90&url=https%3A%2F%2Fwww.htmlcsscolor.com%2F&wgl=1&uach=WyIiLCIiLCIiLCIiLCIiLFtdLGZhbHNlLG51bGwsIiIsW10sZmFsc2Vd&dt=1666909632990&bpp=1&bdt=547&idt=135&shv=r20221026&mjsv=m202210170101&ptt=9&saldr=aa&abxe=1&prev_fmts=336x280&correlator=1395664366011&frm=20&pv=1&ga_vid=1642179467.1666909633&ga_sid=1666909633&ga_hid=2094706188&ga_fc=0&u_tz=0&u_his=2&u_h=1200&u_w=1600&u_ah=1200&u_aw=1600&u_cd=24&u_sd=1&dmc=8&adx=316&ady=780&biw=1600&bih=1200&scr_x=0&scr_y=0&eid=44759875%2C44759926%2C44759842%2C42531706%2C44775016%2C31060047&oid=2&pvsid=3305656810576298&tmod=31219269&uas=0&nvt=1&eae=0&fc=896&brdim=0%2C0%2C0%2C0%2C1600%2C0%2C1600%2C1200%2C1600%2C1200&vis=1&rsz=%7C%7CpeE%7C&abl=CS&pfx=0&fu=0&bc=31&ifi=2&uci=a!2&fsb=1&xpc=7tGnmPHXmv&p=https%3A//www.htmlcsscolor.com&dtd=138"
data-google-container-id="a!2" data-google-query-id="CJC2vKS6gfsCFXsZewodI3AGqA" data-load-complete="true"></iframe></div>
</ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
<!-- Shades -->
<h2 id="cntMain_lblShades">Random colors<a href="/random-colors" class="pull-right" title="Random colors">more!</a></h2>
<div id="cntMain_pnlShades">
<div class="colorbox" style="background-color:#9A59BB"><a style="color:#FFFFFF" href="/hex/9A59BB">#9A59BB</a></div>
<div class="colorbox" style="background-color:#C7BD12"><a style="color:#000000" href="/hex/C7BD12">#C7BD12</a></div>
<div class="colorbox" style="background-color:#507EAD"><a style="color:#FFFFFF" href="/hex/507EAD">#507EAD</a></div>
<div class="colorbox" style="background-color:#97AC52"><a style="color:#000000" href="/hex/97AC52">#97AC52</a></div>
<div class="colorbox" style="background-color:#CDA145"><a style="color:#000000" href="/hex/CDA145">#CDA145</a></div>
<div class="colorbox" style="background-color:#7E28F8"><a style="color:#FFFFFF" href="/hex/7E28F8">#7E28F8</a></div>
<div class="colorbox" style="background-color:#94B387"><a style="color:#000000" href="/hex/94B387">#94B387</a></div>
<div class="colorbox" style="background-color:#8F97F6"><a style="color:#000000" href="/hex/8F97F6">#8F97F6</a></div>
<div class="colorbox" style="background-color:#F022CB"><a style="color:#FFFFFF" href="/hex/F022CB">#F022CB</a></div>
<div class="colorbox" style="background-color:#896B0B"><a style="color:#FFFFFF" href="/hex/896B0B">#896B0B</a></div>
<div class="colorbox" style="background-color:#A41D97"><a style="color:#FFFFFF" href="/hex/A41D97">#A41D97</a></div>
</div>
<a name="wheel"></a>
<div class="clearfix"></div>
<hr>
<h3>Color <b>Wheel</b><span class="pull-right text-muted">count: 16777216</span></h3>
<div class="row">
<div class="col-xs-3">
<div id="picker">
<div class="farbtastic">
<div class="color" style="background-color: rgb(150, 255, 0);"></div>
<div class="wheel"></div>
<div class="overlay"></div>
<div class="h-marker marker" style="left: 181px; top: 89px;"></div>
<div class="sl-marker marker" style="left: 96px; top: 94px;"></div>
</div>
</div>
</div>
<div class="col-xs-9">
<div id="pnlColor" class="colorwheelpanel" style="background-color: rgb(147, 197, 75);">
<input name="ctl00$cntMain$txtColor" type="text" value="#93C54B" id="cntMain_txtColor" class="form-control col-xs-2 custom_color"
style="text-align: center; border: none; font-size: x-large; background-color: rgb(147, 197, 75); color: rgb(0, 0, 0);">
<input type="submit" name="ctl00$cntMain$butInfo" value="Get all Info" id="cntMain_butInfo" title="Full information about selected color" class="btn btn-default">
</div>
</div>
</div>
<script>
$(document).ready(function() {
$('#picker').farbtastic('.custom_color');
});
</script>
<script async="" src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- HtmlCssColor.com-970x90 -->
<ins class="adsbygoogle" style="display:inline-block;width:970px;height:90px" data-ad-client="ca-pub-6204451860372322" data-ad-slot="2268112571" data-adsbygoogle-status="done" data-ad-status="filled">
<div id="aswift_2_host" tabindex="0" title="Advertisement" aria-label="Advertisement"
style="border: none; height: 90px; width: 970px; margin: 0px; padding: 0px; position: relative; visibility: visible; background-color: transparent; display: inline-block;"><iframe id="aswift_2" name="aswift_2"
style="left:0;position:absolute;top:0;border:0;width:970px;height:90px;" sandbox="allow-forms allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts allow-top-navigation-by-user-activation" width="970" height="90"
frameborder="0" marginwidth="0" marginheight="0" vspace="0" hspace="0" allowtransparency="true" scrolling="no"
src="https://googleads.g.doubleclick.net/pagead/ads?client=ca-pub-6204451860372322&output=html&h=90&slotname=2268112571&adk=2434431270&adf=2589573863&pi=t.ma~as.2268112571&w=970&lmt=1666909633&format=970x90&url=https%3A%2F%2Fwww.htmlcsscolor.com%2F&wgl=1&uach=WyIiLCIiLCIiLCIiLCIiLFtdLGZhbHNlLG51bGwsIiIsW10sZmFsc2Vd&dt=1666909632991&bpp=1&bdt=549&idt=141&shv=r20221026&mjsv=m202210170101&ptt=9&saldr=aa&abxe=1&prev_fmts=336x280%2C970x90&correlator=1395664366011&frm=20&pv=1&ga_vid=1642179467.1666909633&ga_sid=1666909633&ga_hid=2094706188&ga_fc=0&u_tz=0&u_his=2&u_h=1200&u_w=1600&u_ah=1200&u_aw=1600&u_cd=24&u_sd=1&dmc=8&adx=316&ady=1255&biw=1600&bih=1200&scr_x=0&scr_y=0&eid=44759875%2C44759926%2C44759842%2C42531706%2C44775016%2C31060047&oid=2&pvsid=3305656810576298&tmod=31219269&uas=0&nvt=1&eae=0&fc=896&brdim=0%2C0%2C0%2C0%2C1600%2C0%2C1600%2C1200%2C1600%2C1200&vis=1&rsz=%7C%7CpeEbr%7C&abl=CS&pfx=0&fu=0&bc=31&ifi=3&uci=a!3&btvi=1&fsb=1&xpc=Bfz4EpaC6I&p=https%3A//www.htmlcsscolor.com&dtd=143"
data-google-container-id="a!3" data-google-query-id="CNOuvKS6gfsCFYajGAod_ksH2g" data-load-complete="true"></iframe></div>
</ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
<hr>
<h3>Random <b>Color Gradient</b><span class="pull-right"><a href="/color-gradient" title="Get more color gradients!">more!</a></span></h3>
<img id="cntMain_imgMain" src="/gradient-linear/9A59BB/to/C7BD12.png"><br>
<!-- twitter -->
<br>
<div class="row">
<div class="col-xs-8">
<h3>Color RGB Values</h3>
<p class="main">The <b>choice of color tint</b> is a problem that frequently occurs while working with the <b>background design</b>. People have different reaction on different external irritants and thus the perception of the color is
different either. In ideal world the <b>color on the computer screen</b> coincides with the <b>color</b> observed by the user. But unfortunately this doesn’t happen in real world. <b>RGB color model</b> is widely used in engineering. </p>
<p class="main">The term "<b>color model</b>" sounds incomprehensible and obscure for normal user. It turns out the term color doesn't exist in nature. Color is one of the light characteristic given by the human. Brain, eyes are the measuring
instrument of <b>RGB</b>. <b>RGB</b> is the abbreviation of the words: <i>red</i>, <i>green </i>and <i>blue</i>. How do the <b>RGB colors</b> generate on the <b>computer monitor</b>? The answer is rather simple, by combination of the three
main colors. If the intensity is 100%, the white color will be derived. If there is the absence of all three colors, the black color is derived. Each color has the range from <b>0</b> to <b>255</b>.</p>
<img src="/images/color_spectrum.png" style="width:100%;height:140px;padding-bottom:10px">
<p class="main">In <b>HTML</b> #RrGgBb is used – an entry that is also called <b>hexadecimal</b>: each coordinate is recorded in the form or two hexadecimal numbers without blank spaces. For instance, #RrGgBb – the recording of white color -
<a href="/hex/ffffff">#FFFFFF</a>.</p>
<p class="main">With the <b>development</b> of <b>web technology</b> the broadening of RGB has appeared. The letter A denotes Alpha; it defines the level of the <b>color transparency</b>. Nowadays it is easy to operate the <b>transparency</b>
of <b>web page</b> elements. So if you come across RGBA (or aRGB), don’t be confused, it’s just the standard RGB with the specified level of the transparency (alpha channel).</p>
</div>
<div class="col-xs-4">
<div class="twitter-timeline twitter-timeline-rendered" style="display: flex; width: 520px; max-width: 100%; margin-top: 0px; margin-bottom: 0px;"><iframe id="twitter-widget-0" scrolling="no" frameborder="0" allowtransparency="true"
allowfullscreen="true" class="" style="position: static; visibility: visible; width: 1px; height: 600px; display: block; flex-grow: 1;" title="Twitter Timeline"
src="https://syndication.twitter.com/srv/timeline-profile/screen-name/color_html?dnt=false&embedId=twitter-widget-0&frame=false&hideBorder=false&hideFooter=false&hideHeader=false&hideScrollBar=false&lang=en&maxHeight=600px&origin=https%3A%2F%2Fwww.htmlcsscolor.com%2F&sessionId=9b77abc57c362ba5d116a695ad150ff40b3f3089&showHeader=true&showReplies=false&transparent=false&widgetsVersion=1c23387b1f70c%3A1664388199485"></iframe>
</div>
<script>
! function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0],
p = /^http:/.test(d.location) ? 'http' : 'https';
if (!d.getElementById(id)) {
js = d.createElement(s);
js.id = id;
js.src = p + "://platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js, fjs);
}
}(document, "script", "twitter-wjs");
</script>
</div>
</div>
<hr>
<h3>HTML <b>Color Names</b><span id="cntMain_lblCount" class="pull-right text-muted">count: 140</span></h3>
<div class="row">
<center>
<div id="cntMain_pnlList1" class="col-xs-12">
<div class="colorbox-small" style="background-color:AliceBlue;">
<a href="/hex/F0F8FF" style="color:#000000">AliceBlue</a><br><a href="/hex/F0F8FF" style="color:#000000">#F0F8FF</a>
</div>
<div class="colorbox-small" style="background-color:AntiqueWhite;">
<a href="/hex/FAEBD7" style="color:#000000">AntiqueWhite</a><br><a href="/hex/FAEBD7" style="color:#000000">#FAEBD7</a>
</div>
<div class="colorbox-small" style="background-color:Aqua;">
<a href="/hex/00FFFF" style="color:#000000">Aqua</a><br><a href="/hex/00FFFF" style="color:#000000">#00FFFF</a>
</div>
<div class="colorbox-small" style="background-color:Aquamarine;">
<a href="/hex/7FFFD4" style="color:#000000">Aquamarine</a><br><a href="/hex/7FFFD4" style="color:#000000">#7FFFD4</a>
</div>
<div class="colorbox-small" style="background-color:Azure;">
<a href="/hex/F0FFFF" style="color:#000000">Azure</a><br><a href="/hex/F0FFFF" style="color:#000000">#F0FFFF</a>
</div>
<div class="colorbox-small" style="background-color:Beige;">
<a href="/hex/F5F5DC" style="color:#000000">Beige</a><br><a href="/hex/F5F5DC" style="color:#000000">#F5F5DC</a>
</div>
<div class="colorbox-small" style="background-color:Bisque;">
<a href="/hex/FFE4C4" style="color:#000000">Bisque</a><br><a href="/hex/FFE4C4" style="color:#000000">#FFE4C4</a>
</div>
<div class="colorbox-small" style="background-color:Black;">
<a href="/hex/000000" style="color:#FFFFFF">Black</a><br><a href="/hex/000000" style="color:#FFFFFF">#000000</a>
</div>
<div class="colorbox-small" style="background-color:BlanchedAlmond;">
<a href="/hex/FFEBCD" style="color:#000000">BlanchedAlmond</a><br><a href="/hex/FFEBCD" style="color:#000000">#FFEBCD</a>
</div>
<div class="colorbox-small" style="background-color:Blue;">
<a href="/hex/0000FF" style="color:#FFFFFF">Blue</a><br><a href="/hex/0000FF" style="color:#FFFFFF">#0000FF</a>
</div>
<div class="colorbox-small" style="background-color:BlueViolet;">
<a href="/hex/8A2BE2" style="color:#FFFFFF">BlueViolet</a><br><a href="/hex/8A2BE2" style="color:#FFFFFF">#8A2BE2</a>
</div>
<div class="colorbox-small" style="background-color:Brown;">
<a href="/hex/A52A2A" style="color:#FFFFFF">Brown</a><br><a href="/hex/A52A2A" style="color:#FFFFFF">#A52A2A</a>
</div>
<div class="colorbox-small" style="background-color:BurlyWood;">
<a href="/hex/DEB887" style="color:#000000">BurlyWood</a><br><a href="/hex/DEB887" style="color:#000000">#DEB887</a>
</div>
<div class="colorbox-small" style="background-color:CadetBlue;">
<a href="/hex/5F9EA0" style="color:#FFFFFF">CadetBlue</a><br><a href="/hex/5F9EA0" style="color:#FFFFFF">#5F9EA0</a>
</div>
<div class="colorbox-small" style="background-color:Chartreuse;">
<a href="/hex/7FFF00" style="color:#000000">Chartreuse</a><br><a href="/hex/7FFF00" style="color:#000000">#7FFF00</a>
</div>
<div class="colorbox-small" style="background-color:Chocolate;">
<a href="/hex/D2691E" style="color:#FFFFFF">Chocolate</a><br><a href="/hex/D2691E" style="color:#FFFFFF">#D2691E</a>
</div>
<div class="colorbox-small" style="background-color:Coral;">
<a href="/hex/FF7F50" style="color:#000000">Coral</a><br><a href="/hex/FF7F50" style="color:#000000">#FF7F50</a>
</div>
<div class="colorbox-small" style="background-color:CornflowerBlue;">
<a href="/hex/6495ED" style="color:#FFFFFF">CornflowerBlue</a><br><a href="/hex/6495ED" style="color:#FFFFFF">#6495ED</a>
</div>
<div class="colorbox-small" style="background-color:Cornsilk;">
<a href="/hex/FFF8DC" style="color:#000000">Cornsilk</a><br><a href="/hex/FFF8DC" style="color:#000000">#FFF8DC</a>
</div>
<div class="colorbox-small" style="background-color:Crimson;">
<a href="/hex/DC143C" style="color:#FFFFFF">Crimson</a><br><a href="/hex/DC143C" style="color:#FFFFFF">#DC143C</a>
</div>
<div class="colorbox-small" style="background-color:Cyan;">
<a href="/hex/00FFFF" style="color:#000000">Cyan</a><br><a href="/hex/00FFFF" style="color:#000000">#00FFFF</a>
</div>
<div class="colorbox-small" style="background-color:DarkBlue;">
<a href="/hex/00008B" style="color:#FFFFFF">DarkBlue</a><br><a href="/hex/00008B" style="color:#FFFFFF">#00008B</a>
</div>
<div class="colorbox-small" style="background-color:DarkCyan;">
<a href="/hex/008B8B" style="color:#FFFFFF">DarkCyan</a><br><a href="/hex/008B8B" style="color:#FFFFFF">#008B8B</a>
</div>
<div class="colorbox-small" style="background-color:DarkGoldenrod;">
<a href="/hex/B8860B" style="color:#FFFFFF">DarkGoldenrod</a><br><a href="/hex/B8860B" style="color:#FFFFFF">#B8860B</a>
</div>
<div class="colorbox-small" style="background-color:DarkGray;">
<a href="/hex/A9A9A9" style="color:#000000">DarkGray</a><br><a href="/hex/A9A9A9" style="color:#000000">#A9A9A9</a>
</div>
<div class="colorbox-small" style="background-color:DarkGreen;">
<a href="/hex/006400" style="color:#FFFFFF">DarkGreen</a><br><a href="/hex/006400" style="color:#FFFFFF">#006400</a>
</div>
<div class="colorbox-small" style="background-color:DarkKhaki;">
<a href="/hex/BDB76B" style="color:#000000">DarkKhaki</a><br><a href="/hex/BDB76B" style="color:#000000">#BDB76B</a>
</div>
<div class="colorbox-small" style="background-color:DarkMagenta;">
<a href="/hex/8B008B" style="color:#FFFFFF">DarkMagenta</a><br><a href="/hex/8B008B" style="color:#FFFFFF">#8B008B</a>
</div>
<div class="colorbox-small" style="background-color:DarkOliveGreen;">
<a href="/hex/556B2F" style="color:#FFFFFF">DarkOliveGreen</a><br><a href="/hex/556B2F" style="color:#FFFFFF">#556B2F</a>
</div>
<div class="colorbox-small" style="background-color:DarkOrange;">
<a href="/hex/FF8C00" style="color:#000000">DarkOrange</a><br><a href="/hex/FF8C00" style="color:#000000">#FF8C00</a>
</div>
<div class="colorbox-small" style="background-color:DarkOrchid;">
<a href="/hex/9932CC" style="color:#FFFFFF">DarkOrchid</a><br><a href="/hex/9932CC" style="color:#FFFFFF">#9932CC</a>
</div>
<div class="colorbox-small" style="background-color:DarkRed;">
<a href="/hex/8B0000" style="color:#FFFFFF">DarkRed</a><br><a href="/hex/8B0000" style="color:#FFFFFF">#8B0000</a>
</div>
<div class="colorbox-small" style="background-color:DarkSalmon;">
<a href="/hex/E9967A" style="color:#000000">DarkSalmon</a><br><a href="/hex/E9967A" style="color:#000000">#E9967A</a>
</div>
<div class="colorbox-small" style="background-color:DarkSeaGreen;">
<a href="/hex/8FBC8B" style="color:#000000">DarkSeaGreen</a><br><a href="/hex/8FBC8B" style="color:#000000">#8FBC8B</a>
</div>
<div class="colorbox-small" style="background-color:DarkSlateBlue;">
<a href="/hex/483D8B" style="color:#FFFFFF">DarkSlateBlue</a><br><a href="/hex/483D8B" style="color:#FFFFFF">#483D8B</a>
</div>
<div class="colorbox-small" style="background-color:DarkSlateGray;">
<a href="/hex/2F4F4F" style="color:#FFFFFF">DarkSlateGray</a><br><a href="/hex/2F4F4F" style="color:#FFFFFF">#2F4F4F</a>
</div>
<div class="colorbox-small" style="background-color:DarkTurquoise;">
<a href="/hex/00CED1" style="color:#FFFFFF">DarkTurquoise</a><br><a href="/hex/00CED1" style="color:#FFFFFF">#00CED1</a>
</div>
<div class="colorbox-small" style="background-color:DarkViolet;">
<a href="/hex/9400D3" style="color:#FFFFFF">DarkViolet</a><br><a href="/hex/9400D3" style="color:#FFFFFF">#9400D3</a>
</div>
<div class="colorbox-small" style="background-color:DeepPink;">
<a href="/hex/FF1493" style="color:#FFFFFF">DeepPink</a><br><a href="/hex/FF1493" style="color:#FFFFFF">#FF1493</a>
</div>
<div class="colorbox-small" style="background-color:DeepSkyBlue;">
<a href="/hex/00BFFF" style="color:#FFFFFF">DeepSkyBlue</a><br><a href="/hex/00BFFF" style="color:#FFFFFF">#00BFFF</a>
</div>
<div class="colorbox-small" style="background-color:DimGray;">
<a href="/hex/696969" style="color:#FFFFFF">DimGray</a><br><a href="/hex/696969" style="color:#FFFFFF">#696969</a>
</div>
<div class="colorbox-small" style="background-color:DodgerBlue;">
<a href="/hex/1E90FF" style="color:#FFFFFF">DodgerBlue</a><br><a href="/hex/1E90FF" style="color:#FFFFFF">#1E90FF</a>
</div>
<div class="colorbox-small" style="background-color:Firebrick;">
<a href="/hex/B22222" style="color:#FFFFFF">Firebrick</a><br><a href="/hex/B22222" style="color:#FFFFFF">#B22222</a>
</div>
<div class="colorbox-small" style="background-color:FloralWhite;">
<a href="/hex/FFFAF0" style="color:#000000">FloralWhite</a><br><a href="/hex/FFFAF0" style="color:#000000">#FFFAF0</a>
</div>
<div class="colorbox-small" style="background-color:ForestGreen;">
<a href="/hex/228B22" style="color:#FFFFFF">ForestGreen</a><br><a href="/hex/228B22" style="color:#FFFFFF">#228B22</a>
</div>
<div class="colorbox-small" style="background-color:Fuchsia;">
<a href="/hex/FF00FF" style="color:#FFFFFF">Fuchsia</a><br><a href="/hex/FF00FF" style="color:#FFFFFF">#FF00FF</a>
</div>
<div class="colorbox-small" style="background-color:Gainsboro;">
<a href="/hex/DCDCDC" style="color:#000000">Gainsboro</a><br><a href="/hex/DCDCDC" style="color:#000000">#DCDCDC</a>
</div>
<div class="colorbox-small" style="background-color:GhostWhite;">
<a href="/hex/F8F8FF" style="color:#000000">GhostWhite</a><br><a href="/hex/F8F8FF" style="color:#000000">#F8F8FF</a>
</div>
<div class="colorbox-small" style="background-color:Gold;">
<a href="/hex/FFD700" style="color:#000000">Gold</a><br><a href="/hex/FFD700" style="color:#000000">#FFD700</a>
</div>
<div class="colorbox-small" style="background-color:Goldenrod;">
<a href="/hex/DAA520" style="color:#000000">Goldenrod</a><br><a href="/hex/DAA520" style="color:#000000">#DAA520</a>
</div>
<div class="colorbox-small" style="background-color:Gray;">
<a href="/hex/808080" style="color:#FFFFFF">Gray</a><br><a href="/hex/808080" style="color:#FFFFFF">#808080</a>
</div>
<div class="colorbox-small" style="background-color:Green;">
<a href="/hex/008000" style="color:#FFFFFF">Green</a><br><a href="/hex/008000" style="color:#FFFFFF">#008000</a>
</div>
<div class="colorbox-small" style="background-color:GreenYellow;">
<a href="/hex/ADFF2F" style="color:#000000">GreenYellow</a><br><a href="/hex/ADFF2F" style="color:#000000">#ADFF2F</a>
</div>
<div class="colorbox-small" style="background-color:Honeydew;">
<a href="/hex/F0FFF0" style="color:#000000">Honeydew</a><br><a href="/hex/F0FFF0" style="color:#000000">#F0FFF0</a>
</div>
<div class="colorbox-small" style="background-color:HotPink;">
<a href="/hex/FF69B4" style="color:#000000">HotPink</a><br><a href="/hex/FF69B4" style="color:#000000">#FF69B4</a>
</div>
<div class="colorbox-small" style="background-color:IndianRed;">
<a href="/hex/CD5C5C" style="color:#FFFFFF">IndianRed</a><br><a href="/hex/CD5C5C" style="color:#FFFFFF">#CD5C5C</a>
</div>
<div class="colorbox-small" style="background-color:Indigo;">
<a href="/hex/4B0082" style="color:#FFFFFF">Indigo</a><br><a href="/hex/4B0082" style="color:#FFFFFF">#4B0082</a>
</div>
<div class="colorbox-small" style="background-color:Ivory;">
<a href="/hex/FFFFF0" style="color:#000000">Ivory</a><br><a href="/hex/FFFFF0" style="color:#000000">#FFFFF0</a>
</div>
<div class="colorbox-small" style="background-color:Khaki;">
<a href="/hex/F0E68C" style="color:#000000">Khaki</a><br><a href="/hex/F0E68C" style="color:#000000">#F0E68C</a>
</div>
<div class="colorbox-small" style="background-color:Lavender;">
<a href="/hex/E6E6FA" style="color:#000000">Lavender</a><br><a href="/hex/E6E6FA" style="color:#000000">#E6E6FA</a>
</div>
<div class="colorbox-small" style="background-color:LavenderBlush;">
<a href="/hex/FFF0F5" style="color:#000000">LavenderBlush</a><br><a href="/hex/FFF0F5" style="color:#000000">#FFF0F5</a>
</div>
<div class="colorbox-small" style="background-color:LawnGreen;">
<a href="/hex/7CFC00" style="color:#000000">LawnGreen</a><br><a href="/hex/7CFC00" style="color:#000000">#7CFC00</a>
</div>
<div class="colorbox-small" style="background-color:LemonChiffon;">
<a href="/hex/FFFACD" style="color:#000000">LemonChiffon</a><br><a href="/hex/FFFACD" style="color:#000000">#FFFACD</a>
</div>
<div class="colorbox-small" style="background-color:LightBlue;">
<a href="/hex/ADD8E6" style="color:#000000">LightBlue</a><br><a href="/hex/ADD8E6" style="color:#000000">#ADD8E6</a>
</div>
<div class="colorbox-small" style="background-color:LightCoral;">
<a href="/hex/F08080" style="color:#000000">LightCoral</a><br><a href="/hex/F08080" style="color:#000000">#F08080</a>
</div>
<div class="colorbox-small" style="background-color:LightCyan;">
<a href="/hex/E0FFFF" style="color:#000000">LightCyan</a><br><a href="/hex/E0FFFF" style="color:#000000">#E0FFFF</a>
</div>
<div class="colorbox-small" style="background-color:LightGoldenrodYellow;">
<a href="/hex/FAFAD2" style="color:#000000">LightGoldenrodYellow</a><br><a href="/hex/FAFAD2" style="color:#000000">#FAFAD2</a>
</div>
<div class="colorbox-small" style="background-color:LightGreen;">
<a href="/hex/90EE90" style="color:#000000">LightGreen</a><br><a href="/hex/90EE90" style="color:#000000">#90EE90</a>
</div>
<div class="colorbox-small" style="background-color:LightGray;">
<a href="/hex/D3D3D3" style="color:#000000">LightGray</a><br><a href="/hex/D3D3D3" style="color:#000000">#D3D3D3</a>
</div>
<div class="colorbox-small" style="background-color:LightPink;">
<a href="/hex/FFB6C1" style="color:#000000">LightPink</a><br><a href="/hex/FFB6C1" style="color:#000000">#FFB6C1</a>
</div>
<div class="colorbox-small" style="background-color:LightSalmon;">
<a href="/hex/FFA07A" style="color:#000000">LightSalmon</a><br><a href="/hex/FFA07A" style="color:#000000">#FFA07A</a>
</div>
<div class="colorbox-small" style="background-color:LightSeaGreen;">
<a href="/hex/20B2AA" style="color:#FFFFFF">LightSeaGreen</a><br><a href="/hex/20B2AA" style="color:#FFFFFF">#20B2AA</a>
</div>
<div class="colorbox-small" style="background-color:LightSkyBlue;">
<a href="/hex/87CEFA" style="color:#000000">LightSkyBlue</a><br><a href="/hex/87CEFA" style="color:#000000">#87CEFA</a>
</div>
<div class="colorbox-small" style="background-color:LightSlateGray;">
<a href="/hex/778899" style="color:#FFFFFF">LightSlateGray</a><br><a href="/hex/778899" style="color:#FFFFFF">#778899</a>
</div>
<div class="colorbox-small" style="background-color:LightSteelBlue;">
<a href="/hex/B0C4DE" style="color:#000000">LightSteelBlue</a><br><a href="/hex/B0C4DE" style="color:#000000">#B0C4DE</a>
</div>
<div class="colorbox-small" style="background-color:LightYellow;">
<a href="/hex/FFFFE0" style="color:#000000">LightYellow</a><br><a href="/hex/FFFFE0" style="color:#000000">#FFFFE0</a>
</div>
<div class="colorbox-small" style="background-color:Lime;">
<a href="/hex/00FF00" style="color:#FFFFFF">Lime</a><br><a href="/hex/00FF00" style="color:#FFFFFF">#00FF00</a>
</div>
<div class="colorbox-small" style="background-color:LimeGreen;">
<a href="/hex/32CD32" style="color:#FFFFFF">LimeGreen</a><br><a href="/hex/32CD32" style="color:#FFFFFF">#32CD32</a>
</div>
<div class="colorbox-small" style="background-color:Linen;">
<a href="/hex/FAF0E6" style="color:#000000">Linen</a><br><a href="/hex/FAF0E6" style="color:#000000">#FAF0E6</a>
</div>
<div class="colorbox-small" style="background-color:Magenta;">
<a href="/hex/FF00FF" style="color:#FFFFFF">Magenta</a><br><a href="/hex/FF00FF" style="color:#FFFFFF">#FF00FF</a>
</div>
<div class="colorbox-small" style="background-color:Maroon;">
<a href="/hex/800000" style="color:#FFFFFF">Maroon</a><br><a href="/hex/800000" style="color:#FFFFFF">#800000</a>
</div>
<div class="colorbox-small" style="background-color:MediumAquamarine;">
<a href="/hex/66CDAA" style="color:#000000">MediumAquamarine</a><br><a href="/hex/66CDAA" style="color:#000000">#66CDAA</a>
</div>
<div class="colorbox-small" style="background-color:MediumBlue;">
<a href="/hex/0000CD" style="color:#FFFFFF">MediumBlue</a><br><a href="/hex/0000CD" style="color:#FFFFFF">#0000CD</a>
</div>
<div class="colorbox-small" style="background-color:MediumOrchid;">
<a href="/hex/BA55D3" style="color:#FFFFFF">MediumOrchid</a><br><a href="/hex/BA55D3" style="color:#FFFFFF">#BA55D3</a>
</div>
<div class="colorbox-small" style="background-color:MediumPurple;">
<a href="/hex/9370DB" style="color:#FFFFFF">MediumPurple</a><br><a href="/hex/9370DB" style="color:#FFFFFF">#9370DB</a>
</div>
<div class="colorbox-small" style="background-color:MediumSeaGreen;">
<a href="/hex/3CB371" style="color:#FFFFFF">MediumSeaGreen</a><br><a href="/hex/3CB371" style="color:#FFFFFF">#3CB371</a>
</div>
<div class="colorbox-small" style="background-color:MediumSlateBlue;">
<a href="/hex/7B68EE" style="color:#FFFFFF">MediumSlateBlue</a><br><a href="/hex/7B68EE" style="color:#FFFFFF">#7B68EE</a>
</div>
<div class="colorbox-small" style="background-color:MediumSpringGreen;">
<a href="/hex/00FA9A" style="color:#000000">MediumSpringGreen</a><br><a href="/hex/00FA9A" style="color:#000000">#00FA9A</a>
</div>
<div class="colorbox-small" style="background-color:MediumTurquoise;">
<a href="/hex/48D1CC" style="color:#000000">MediumTurquoise</a><br><a href="/hex/48D1CC" style="color:#000000">#48D1CC</a>
</div>
<div class="colorbox-small" style="background-color:MediumVioletRed;">
<a href="/hex/C71585" style="color:#FFFFFF">MediumVioletRed</a><br><a href="/hex/C71585" style="color:#FFFFFF">#C71585</a>
</div>
<div class="colorbox-small" style="background-color:MidnightBlue;">
<a href="/hex/191970" style="color:#FFFFFF">MidnightBlue</a><br><a href="/hex/191970" style="color:#FFFFFF">#191970</a>
</div>
<div class="colorbox-small" style="background-color:MintCream;">
<a href="/hex/F5FFFA" style="color:#000000">MintCream</a><br><a href="/hex/F5FFFA" style="color:#000000">#F5FFFA</a>
</div>
<div class="colorbox-small" style="background-color:MistyRose;">
<a href="/hex/FFE4E1" style="color:#000000">MistyRose</a><br><a href="/hex/FFE4E1" style="color:#000000">#FFE4E1</a>
</div>
<div class="colorbox-small" style="background-color:Moccasin;">
<a href="/hex/FFE4B5" style="color:#000000">Moccasin</a><br><a href="/hex/FFE4B5" style="color:#000000">#FFE4B5</a>
</div>
<div class="colorbox-small" style="background-color:NavajoWhite;">
<a href="/hex/FFDEAD" style="color:#000000">NavajoWhite</a><br><a href="/hex/FFDEAD" style="color:#000000">#FFDEAD</a>
</div>
<div class="colorbox-small" style="background-color:Navy;">
<a href="/hex/000080" style="color:#FFFFFF">Navy</a><br><a href="/hex/000080" style="color:#FFFFFF">#000080</a>
</div>
<div class="colorbox-small" style="background-color:OldLace;">
<a href="/hex/FDF5E6" style="color:#000000">OldLace</a><br><a href="/hex/FDF5E6" style="color:#000000">#FDF5E6</a>
</div>
<div class="colorbox-small" style="background-color:Olive;">
<a href="/hex/808000" style="color:#FFFFFF">Olive</a><br><a href="/hex/808000" style="color:#FFFFFF">#808000</a>
</div>
<div class="colorbox-small" style="background-color:OliveDrab;">
<a href="/hex/6B8E23" style="color:#FFFFFF">OliveDrab</a><br><a href="/hex/6B8E23" style="color:#FFFFFF">#6B8E23</a>
</div>
<div class="colorbox-small" style="background-color:Orange;">
<a href="/hex/FFA500" style="color:#000000">Orange</a><br><a href="/hex/FFA500" style="color:#000000">#FFA500</a>
</div>
<div class="colorbox-small" style="background-color:OrangeRed;">
<a href="/hex/FF4500" style="color:#FFFFFF">OrangeRed</a><br><a href="/hex/FF4500" style="color:#FFFFFF">#FF4500</a>
</div>
<div class="colorbox-small" style="background-color:Orchid;">
<a href="/hex/DA70D6" style="color:#000000">Orchid</a><br><a href="/hex/DA70D6" style="color:#000000">#DA70D6</a>
</div>
<div class="colorbox-small" style="background-color:PaleGoldenrod;">
<a href="/hex/EEE8AA" style="color:#000000">PaleGoldenrod</a><br><a href="/hex/EEE8AA" style="color:#000000">#EEE8AA</a>
</div>
<div class="colorbox-small" style="background-color:PaleGreen;">
<a href="/hex/98FB98" style="color:#000000">PaleGreen</a><br><a href="/hex/98FB98" style="color:#000000">#98FB98</a>
</div>
<div class="colorbox-small" style="background-color:PaleTurquoise;">
<a href="/hex/AFEEEE" style="color:#000000">PaleTurquoise</a><br><a href="/hex/AFEEEE" style="color:#000000">#AFEEEE</a>
</div>
<div class="colorbox-small" style="background-color:PaleVioletRed;">
<a href="/hex/DB7093" style="color:#FFFFFF">PaleVioletRed</a><br><a href="/hex/DB7093" style="color:#FFFFFF">#DB7093</a>
</div>
<div class="colorbox-small" style="background-color:PapayaWhip;">
<a href="/hex/FFEFD5" style="color:#000000">PapayaWhip</a><br><a href="/hex/FFEFD5" style="color:#000000">#FFEFD5</a>
</div>
<div class="colorbox-small" style="background-color:PeachPuff;">
<a href="/hex/FFDAB9" style="color:#000000">PeachPuff</a><br><a href="/hex/FFDAB9" style="color:#000000">#FFDAB9</a>
</div>
<div class="colorbox-small" style="background-color:Peru;">
<a href="/hex/CD853F" style="color:#FFFFFF">Peru</a><br><a href="/hex/CD853F" style="color:#FFFFFF">#CD853F</a>
</div>
<div class="colorbox-small" style="background-color:Pink;">
<a href="/hex/FFC0CB" style="color:#000000">Pink</a><br><a href="/hex/FFC0CB" style="color:#000000">#FFC0CB</a>
</div>
<div class="colorbox-small" style="background-color:Plum;">
<a href="/hex/DDA0DD" style="color:#000000">Plum</a><br><a href="/hex/DDA0DD" style="color:#000000">#DDA0DD</a>
</div>
<div class="colorbox-small" style="background-color:PowderBlue;">
<a href="/hex/B0E0E6" style="color:#000000">PowderBlue</a><br><a href="/hex/B0E0E6" style="color:#000000">#B0E0E6</a>
</div>
<div class="colorbox-small" style="background-color:Purple;">
<a href="/hex/800080" style="color:#FFFFFF">Purple</a><br><a href="/hex/800080" style="color:#FFFFFF">#800080</a>
</div>
<div class="colorbox-small" style="background-color:Red;">
<a href="/hex/FF0000" style="color:#FFFFFF">Red</a><br><a href="/hex/FF0000" style="color:#FFFFFF">#FF0000</a>
</div>
<div class="colorbox-small" style="background-color:RosyBrown;">
<a href="/hex/BC8F8F" style="color:#000000">RosyBrown</a><br><a href="/hex/BC8F8F" style="color:#000000">#BC8F8F</a>
</div>
<div class="colorbox-small" style="background-color:RoyalBlue;">
<a href="/hex/4169E1" style="color:#FFFFFF">RoyalBlue</a><br><a href="/hex/4169E1" style="color:#FFFFFF">#4169E1</a>
</div>
<div class="colorbox-small" style="background-color:SaddleBrown;">
<a href="/hex/8B4513" style="color:#FFFFFF">SaddleBrown</a><br><a href="/hex/8B4513" style="color:#FFFFFF">#8B4513</a>
</div>
<div class="colorbox-small" style="background-color:Salmon;">
<a href="/hex/FA8072" style="color:#000000">Salmon</a><br><a href="/hex/FA8072" style="color:#000000">#FA8072</a>
</div>
<div class="colorbox-small" style="background-color:SandyBrown;">
<a href="/hex/F4A460" style="color:#000000">SandyBrown</a><br><a href="/hex/F4A460" style="color:#000000">#F4A460</a>
</div>
<div class="colorbox-small" style="background-color:SeaGreen;">
<a href="/hex/2E8B57" style="color:#FFFFFF">SeaGreen</a><br><a href="/hex/2E8B57" style="color:#FFFFFF">#2E8B57</a>
</div>
<div class="colorbox-small" style="background-color:SeaShell;">
<a href="/hex/FFF5EE" style="color:#000000">SeaShell</a><br><a href="/hex/FFF5EE" style="color:#000000">#FFF5EE</a>
</div>
<div class="colorbox-small" style="background-color:Sienna;">
<a href="/hex/A0522D" style="color:#FFFFFF">Sienna</a><br><a href="/hex/A0522D" style="color:#FFFFFF">#A0522D</a>
</div>
<div class="colorbox-small" style="background-color:Silver;">
<a href="/hex/C0C0C0" style="color:#000000">Silver</a><br><a href="/hex/C0C0C0" style="color:#000000">#C0C0C0</a>
</div>
<div class="colorbox-small" style="background-color:SkyBlue;">
<a href="/hex/87CEEB" style="color:#000000">SkyBlue</a><br><a href="/hex/87CEEB" style="color:#000000">#87CEEB</a>
</div>
<div class="colorbox-small" style="background-color:SlateBlue;">
<a href="/hex/6A5ACD" style="color:#FFFFFF">SlateBlue</a><br><a href="/hex/6A5ACD" style="color:#FFFFFF">#6A5ACD</a>
</div>
<div class="colorbox-small" style="background-color:SlateGray;">
<a href="/hex/708090" style="color:#FFFFFF">SlateGray</a><br><a href="/hex/708090" style="color:#FFFFFF">#708090</a>
</div>
<div class="colorbox-small" style="background-color:Snow;">
<a href="/hex/FFFAFA" style="color:#000000">Snow</a><br><a href="/hex/FFFAFA" style="color:#000000">#FFFAFA</a>
</div>
<div class="colorbox-small" style="background-color:SpringGreen;">
<a href="/hex/00FF7F" style="color:#000000">SpringGreen</a><br><a href="/hex/00FF7F" style="color:#000000">#00FF7F</a>
</div>
<div class="colorbox-small" style="background-color:SteelBlue;">
<a href="/hex/4682B4" style="color:#FFFFFF">SteelBlue</a><br><a href="/hex/4682B4" style="color:#FFFFFF">#4682B4</a>
</div>
<div class="colorbox-small" style="background-color:Tan;">
<a href="/hex/D2B48C" style="color:#000000">Tan</a><br><a href="/hex/D2B48C" style="color:#000000">#D2B48C</a>
</div>
<div class="colorbox-small" style="background-color:Teal;">
<a href="/hex/008080" style="color:#FFFFFF">Teal</a><br><a href="/hex/008080" style="color:#FFFFFF">#008080</a>
</div>
<div class="colorbox-small" style="background-color:Thistle;">
<a href="/hex/D8BFD8" style="color:#000000">Thistle</a><br><a href="/hex/D8BFD8" style="color:#000000">#D8BFD8</a>
</div>
<div class="colorbox-small" style="background-color:Tomato;">
<a href="/hex/FF6347" style="color:#FFFFFF">Tomato</a><br><a href="/hex/FF6347" style="color:#FFFFFF">#FF6347</a>
</div>
<div class="colorbox-small" style="background-color:Turquoise;">
<a href="/hex/40E0D0" style="color:#000000">Turquoise</a><br><a href="/hex/40E0D0" style="color:#000000">#40E0D0</a>
</div>
<div class="colorbox-small" style="background-color:Violet;">
<a href="/hex/EE82EE" style="color:#000000">Violet</a><br><a href="/hex/EE82EE" style="color:#000000">#EE82EE</a>
</div>
<div class="colorbox-small" style="background-color:Wheat;">
<a href="/hex/F5DEB3" style="color:#000000">Wheat</a><br><a href="/hex/F5DEB3" style="color:#000000">#F5DEB3</a>
</div>
<div class="colorbox-small" style="background-color:White;">
<a href="/hex/FFFFFF" style="color:#000000">White</a><br><a href="/hex/FFFFFF" style="color:#000000">#FFFFFF</a>
</div>
<div class="colorbox-small" style="background-color:WhiteSmoke;">
<a href="/hex/F5F5F5" style="color:#000000">WhiteSmoke</a><br><a href="/hex/F5F5F5" style="color:#000000">#F5F5F5</a>
</div>
<div class="colorbox-small" style="background-color:Yellow;">
<a href="/hex/FFFF00" style="color:#000000">Yellow</a><br><a href="/hex/FFFF00" style="color:#000000">#FFFF00</a>
</div>
<div class="colorbox-small" style="background-color:YellowGreen;">
<a href="/hex/9ACD32" style="color:#000000">YellowGreen</a><br><a href="/hex/9ACD32" style="color:#000000">#9ACD32</a>
</div>
</div>
</center>
</div>
<hr>
<a name="color_information"></a>
<h2>HTML & CSS color</h2>
<p class="main">Let's start with the <b>HTML colors</b>. They are indicated with the six signs going after the sign pound (<b>#</b>, or <b>sharp</b>). For instance, <a href="/hex/000000">#000000</a>. <b>HTML color</b> is set by using
<b>HEX code</b>. <b>HEX color</b> is the <i>hexadecimal</i> notion of <b>RGB</b>. It is worth reminding that <b>colors</b> are represented in the three groups of <b>HEX numbers</b>. Each group corresponds to <b>particular color</b>. Each of the
<b>three colors</b> – <a href="/hex/FF0000" title="Red color in RGB">red</a>, <a href="/hex/00FF00" title="Green color in RGB">green</a> and <a href="/hex/0000FF" title="Blue color in RGB">blue</a> – gets the notion beginning with <i>00</i>
till <i>FF</i>. The <b>color model</b> based on <i>red, green and blue</i> components is called <b>RGB</b> (red, green, blue). Background is also an essential concept. With the help of <b>CSS</b> one can create the <b>background</b> of the
<b>web page</b> and other entries. The experienced <b>web designer</b> is comforted by the thought that <b>CSS</b> allows to use <b>16777216 colors</b> that are represented by the name, <i>RGB notion</i> or <i>HEX code</i>.</p>
<p class="main">Surfing the <b>Internet sites</b> we often pay attention to the effect, background and backdrop, flare spots etc. In <b>web designing</b> all of these are done with the help of <b>color gradient</b>
(<a href="/color-gradient" title="Color gradient generator">smooth blend of colors</a>). Here goes the question. What is the best way of choosing the correct color combination? The problem of <b>right color</b> choice is commonly encountered
problem in <b>web designing</b>. Some <b>colors are blended</b> harmoniously some not. The <a href="#wheel" title="Color wheel RGB circle model">color wheel</a> helps both the novice and the <b>professional web designer</b> resolve the dilemma
of <b>color choice</b>.</p>
<p class="main">The <b>color layout</b> in <a href="#wheel" title="Color wheel">color wheel</a> corresponds with the palette of <b>RGB colors</b> where red, blue and green colors can be noticed easily. The <b>complementary colors</b> are
generated by the combination of the main colors. They are yellow, light blue (sky blue) and purple.</p>
<p class="main">It is very important for <b>web designer</b> to work with <b>color</b> skillfully and competently. There is no sense denying the bond between <i>the color</i> and <i>the emotions</i>. A self-respecting <i>web designer</i> won't
miss the opportunity to use this impact. An average user won't remember the <b>color of the background</b> but after being on line for some time he or she will form a particular attitude to the web site. The right color choice not only
guarantees the positive frame of the site but it makes the perception of the given information much easier.</p>
<hr>
<footer>
<div class="row">
<div class="col-xs-12">
<div>
<a href="/" title="Color web design HTML">Home</a> <a href="/color-gradient" title="Online Html Css color gradient generator">Color gradient</a>
<a href="/web-safe-colors" title="Web safe pallete, colors for web development">216 web safe colors</a> <a href="/contacts">Contacts</a> <span class="pull-right"> </span>
</div><br>
<div class="pull-right" style="padding-top:10px">
<script>
(function(i, s, o, g, r, a, m) {
i['GoogleAnalyticsObject'] = r;
i[r] = i[r] || function() {
(i[r].q = i[r].q || []).push(arguments)
}, i[r].l = 1 * new Date();
a = s.createElement(o),
m = s.getElementsByTagName(o)[0];
a.async = 1;
a.src = g;
m.parentNode.insertBefore(a, m)
})(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');
ga('create', 'UA-33901098-7', 'auto');
ga('send', 'pageview');
</script>
</div>
<div>
<a href="http://www.8bytes.net"><img src="/../../images/8b.png" width="50" class="pull-left footer-logo"></a>
<p>Made by <a href="http://koshovyi.com">Koshevoy Dmitry</a> [<a href="/contacts">contacts</a>],</p>
<p>© <span id="uscFooter_lblYear">2014-2022</span> Ukraine, Mykolayiv.</p>
</div>
</div>
</div>
</footer>
</div>
</form>Text Content
Color picker: ▼ Random * * Tools * Main * Color home page * Color wheel * Gradient generator * * Sets * Web safe colors * HTML & CSS Named colors * Color names RGB values * Random colors * * Links * Themes & templates * Contacts HTML CSS COLOR PICKERRGB HEX CMYK HSB HSV HSL x Did you like it? Well, then please consider making a donation :) This small site is a result of a hard-working process of one person. Server and domain have been paid with my own funds. All new feature development occasionally happens in the after-work hours only and driven by its owner's desperate passion. If you do like this site or it has helped you by any means, you can support this resource financially in any possible way you prefer. All funds will be immediately invested in the future support and new feature development. Thank you a lot and May the Force be with you! WELCOMECOLOR PICKER, COLOR WHEEL AND ALL ABOUT COLOR! Free online Color (USA) or Colour (British) tools: information, gradient generator, color wheels etc. Creating a unique and what is very essential recognizable site, it's necessary to take into account the major factor – the color (or colour, British). The success or vice versa the failure of the site depends on the competently chosen color scheme. Color is the most powerful and the most complicated element of the psychological impact. That's why the scrutiny of the issue is the process of the great importance. Color is the result of the combination of three components: the source of light, the object and the observer. Every color or the combinations of the colors are perceived differently: visually and psychically, emotionally and psychologically. It is undeniable fact that any web designer, working with the color, is guided by the subjective perception. One should remember the color blend is neatly selected by an expert. To avoid reinventing the wheel it is worth knowing and using the rules already in existence. Here are the basic concepts. Read more information. -------------------------------------------------------------------------------- HTML named colors RGB colors Web safe colors Random colors Gradient RANDOM COLORSMORE! #9A59BB #C7BD12 #507EAD #97AC52 #CDA145 #7E28F8 #94B387 #8F97F6 #F022CB #896B0B #A41D97 -------------------------------------------------------------------------------- COLOR WHEELCOUNT: 16777216 -------------------------------------------------------------------------------- RANDOM COLOR GRADIENTMORE! COLOR RGB VALUES The choice of color tint is a problem that frequently occurs while working with the background design. People have different reaction on different external irritants and thus the perception of the color is different either. In ideal world the color on the computer screen coincides with the color observed by the user. But unfortunately this doesn’t happen in real world. RGB color model is widely used in engineering. The term "color model" sounds incomprehensible and obscure for normal user. It turns out the term color doesn't exist in nature. Color is one of the light characteristic given by the human. Brain, eyes are the measuring instrument of RGB. RGB is the abbreviation of the words: red, green and blue. How do the RGB colors generate on the computer monitor? The answer is rather simple, by combination of the three main colors. If the intensity is 100%, the white color will be derived. If there is the absence of all three colors, the black color is derived. Each color has the range from 0 to 255. In HTML #RrGgBb is used – an entry that is also called hexadecimal: each coordinate is recorded in the form or two hexadecimal numbers without blank spaces. For instance, #RrGgBb – the recording of white color - #FFFFFF. With the development of web technology the broadening of RGB has appeared. The letter A denotes Alpha; it defines the level of the color transparency. Nowadays it is easy to operate the transparency of web page elements. So if you come across RGBA (or aRGB), don’t be confused, it’s just the standard RGB with the specified level of the transparency (alpha channel). -------------------------------------------------------------------------------- HTML COLOR NAMESCOUNT: 140 AliceBlue #F0F8FF AntiqueWhite #FAEBD7 Aqua #00FFFF Aquamarine #7FFFD4 Azure #F0FFFF Beige #F5F5DC Bisque #FFE4C4 Black #000000 BlanchedAlmond #FFEBCD Blue #0000FF BlueViolet #8A2BE2 Brown #A52A2A BurlyWood #DEB887 CadetBlue #5F9EA0 Chartreuse #7FFF00 Chocolate #D2691E Coral #FF7F50 CornflowerBlue #6495ED Cornsilk #FFF8DC Crimson #DC143C Cyan #00FFFF DarkBlue #00008B DarkCyan #008B8B DarkGoldenrod #B8860B DarkGray #A9A9A9 DarkGreen #006400 DarkKhaki #BDB76B DarkMagenta #8B008B DarkOliveGreen #556B2F DarkOrange #FF8C00 DarkOrchid #9932CC DarkRed #8B0000 DarkSalmon #E9967A DarkSeaGreen #8FBC8B DarkSlateBlue #483D8B DarkSlateGray #2F4F4F DarkTurquoise #00CED1 DarkViolet #9400D3 DeepPink #FF1493 DeepSkyBlue #00BFFF DimGray #696969 DodgerBlue #1E90FF Firebrick #B22222 FloralWhite #FFFAF0 ForestGreen #228B22 Fuchsia #FF00FF Gainsboro #DCDCDC GhostWhite #F8F8FF Gold #FFD700 Goldenrod #DAA520 Gray #808080 Green #008000 GreenYellow #ADFF2F Honeydew #F0FFF0 HotPink #FF69B4 IndianRed #CD5C5C Indigo #4B0082 Ivory #FFFFF0 Khaki #F0E68C Lavender #E6E6FA LavenderBlush #FFF0F5 LawnGreen #7CFC00 LemonChiffon #FFFACD LightBlue #ADD8E6 LightCoral #F08080 LightCyan #E0FFFF LightGoldenrodYellow #FAFAD2 LightGreen #90EE90 LightGray #D3D3D3 LightPink #FFB6C1 LightSalmon #FFA07A LightSeaGreen #20B2AA LightSkyBlue #87CEFA LightSlateGray #778899 LightSteelBlue #B0C4DE LightYellow #FFFFE0 Lime #00FF00 LimeGreen #32CD32 Linen #FAF0E6 Magenta #FF00FF Maroon #800000 MediumAquamarine #66CDAA MediumBlue #0000CD MediumOrchid #BA55D3 MediumPurple #9370DB MediumSeaGreen #3CB371 MediumSlateBlue #7B68EE MediumSpringGreen #00FA9A MediumTurquoise #48D1CC MediumVioletRed #C71585 MidnightBlue #191970 MintCream #F5FFFA MistyRose #FFE4E1 Moccasin #FFE4B5 NavajoWhite #FFDEAD Navy #000080 OldLace #FDF5E6 Olive #808000 OliveDrab #6B8E23 Orange #FFA500 OrangeRed #FF4500 Orchid #DA70D6 PaleGoldenrod #EEE8AA PaleGreen #98FB98 PaleTurquoise #AFEEEE PaleVioletRed #DB7093 PapayaWhip #FFEFD5 PeachPuff #FFDAB9 Peru #CD853F Pink #FFC0CB Plum #DDA0DD PowderBlue #B0E0E6 Purple #800080 Red #FF0000 RosyBrown #BC8F8F RoyalBlue #4169E1 SaddleBrown #8B4513 Salmon #FA8072 SandyBrown #F4A460 SeaGreen #2E8B57 SeaShell #FFF5EE Sienna #A0522D Silver #C0C0C0 SkyBlue #87CEEB SlateBlue #6A5ACD SlateGray #708090 Snow #FFFAFA SpringGreen #00FF7F SteelBlue #4682B4 Tan #D2B48C Teal #008080 Thistle #D8BFD8 Tomato #FF6347 Turquoise #40E0D0 Violet #EE82EE Wheat #F5DEB3 White #FFFFFF WhiteSmoke #F5F5F5 Yellow #FFFF00 YellowGreen #9ACD32 -------------------------------------------------------------------------------- HTML & CSS COLOR Let's start with the HTML colors. They are indicated with the six signs going after the sign pound (#, or sharp). For instance, #000000. HTML color is set by using HEX code. HEX color is the hexadecimal notion of RGB. It is worth reminding that colors are represented in the three groups of HEX numbers. Each group corresponds to particular color. Each of the three colors – red, green and blue – gets the notion beginning with 00 till FF. The color model based on red, green and blue components is called RGB (red, green, blue). Background is also an essential concept. With the help of CSS one can create the background of the web page and other entries. The experienced web designer is comforted by the thought that CSS allows to use 16777216 colors that are represented by the name, RGB notion or HEX code. Surfing the Internet sites we often pay attention to the effect, background and backdrop, flare spots etc. In web designing all of these are done with the help of color gradient (smooth blend of colors). Here goes the question. What is the best way of choosing the correct color combination? The problem of right color choice is commonly encountered problem in web designing. Some colors are blended harmoniously some not. The color wheel helps both the novice and the professional web designer resolve the dilemma of color choice. The color layout in color wheel corresponds with the palette of RGB colors where red, blue and green colors can be noticed easily. The complementary colors are generated by the combination of the main colors. They are yellow, light blue (sky blue) and purple. It is very important for web designer to work with color skillfully and competently. There is no sense denying the bond between the color and the emotions. A self-respecting web designer won't miss the opportunity to use this impact. An average user won't remember the color of the background but after being on line for some time he or she will form a particular attitude to the web site. The right color choice not only guarantees the positive frame of the site but it makes the perception of the given information much easier. -------------------------------------------------------------------------------- Home Color gradient 216 web safe colors Contacts Made by Koshevoy Dmitry [contacts], © 2014-2022 Ukraine, Mykolayiv. less cancelchoose