إنضم لنا

Code html warna / html color









code warna






Jika kalian ingin pasang di blog sendiri berikut codenya
<amp-iframe allowfullscreen="" allowtransparency="" frameborder="0" height="1100" layout="fixed-height" sandbox="allow-scripts allow-same-origin" src="https://cdn.rawgit.com/cenggini/code-collor/master/warna.html?height=1000&amp;theme-id=47&amp;default-tab=result&amp;embed-version=3"></amp-iframe>
<div class="amp-wp-iframe-placeholder" placeholder="">

Jika kalian pengin menghosting sendiri di bawah ini code mentahnya kalian bisa hosting di github
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Codigo de colores</title>
<meta content='width=device-width, initial-scale=1' name='viewport'>

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">

<style>
iframe{border:0}
  
  .clearfix:after,.container:after,.row:after{clear:both}
.container{padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto}@media (min-width:768px){.container{width:750px}}@media (min-width:992px){.container{width:970px}}@media (min-width:1200px){.container{width:1170px}}.row{margin-right:-15px;margin-left:-15px}
.color-wrap{position:relative;clear:both;left:0;width:100%;z-index:500}.color-picker{width:20%;padding-bottom:18%;color:#FFF;position:relative;float:left;top:0;bottom:0}.color-item{position:absolute;margin:0;left:0;right:0;top:0;bottom:0;text-align:center;text-transform:uppercase;padding:35%}.color-item:hover{display:inline;z-index:999;overflow:hidden;cursor:pointer;-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1);-webkit-box-shadow:5px 5px 5px 5px rgba(0,0,0,.2);-moz-box-shadow:5px 5px 5px 5px rgba(0,0,0,.2);box-shadow:5px 5px 5px 5px rgba(0,0,0,.2)}@media only screen and (min-width:768px) and (max-width:959px){.color-picker{width:50%;color:#FFF}.color-item{padding:8%;font-size:.875em}.color-name,.hex-number{position:relative;line-height:22px;text-align:center}}@media only screen and (max-width:767px){.color-picker{width:50%;color:#FFF}.color-item{padding:8%;font-size:.75em}{.color-item{padding:5%;font-size:.75em}.color-name,.hex-number{position:relative;line-height:22px;text-align:center}}@media only screen and (min-width:480px) and (max-width:767px).color-picker{width:100%;color:#FFF}.color-name,.hex-number{position:relative;line-height:12px;text-align:center}}.blank{display:none}@media (max-width:768px){.blank{display:block;height:15px}}
  
</style>

</head>
<body>

<div class="col-md-12">
<div class="container">
<div class="row">
<div class="color-wrap clearfix">
  <div class="color-picker">
   <div class="color-item" style="background-color:#C91F37;">
    <span class="color-name">Foreign crimson</span><br>
    <span class="hex-number">#C91F37</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#DC3023;">
    <span class="color-name">Red orange</span><br>
    <span class="hex-number">#DC3023</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#9D2933;">
    <span class="color-name">Cochineal red</span><br>
    <span class="hex-number">#9D2933</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#CF000F;">
    <span class="color-name">Monza</span><br>
    <span class="hex-number">#CF000F</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#E68364;">
    <span class="color-name">Brewed mustard-brown</span><br>
    <span class="hex-number">#E68364</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#F22613;">
    <span class="color-name">Pomegranate</span><br>
    <span class="hex-number">#F22613</span><br>
   </div>
  </div>

   <div class="color-picker">
   <div class="color-item" style="background-color:#CF3A24;">
    <span class="color-name">Scarlet</span><br>
    <span class="hex-number">#CF3A24</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#C3272B;">
    <span class="color-name">Pure crimson</span><br>
    <span class="hex-number">#C3272B</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color: #8F1D21;">
    <span class="color-name">True red</span><br>
    <span class="hex-number">#8F1D21</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#D24D57;">
    <span class="color-name">Chestnut Rose</span><br>
    <span class="hex-number">#D24D57</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#F08F90;">
    <span class="color-name">One kin dye</span><br>
    <span class="hex-number">#F08F907</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#F47983;">
    <span class="color-name">Peach-colored</span><br>
    <span class="hex-number">#F47983</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#DB5A6B;">
    <span class="color-name">Red plum colored</span><br>
    <span class="hex-number">#DB5A6B</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#C93756;">
    <span class="color-name">Medium crimson</span><br>
    <span class="hex-number">#C93756</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#FCC9B9;">
    <span class="color-name">Cherry blossom color</span><br>
    <span class="hex-number">#FCC9B9</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#FFB3A7;">
    <span class="color-name">Washed-out crimson</span><br>
    <span class="hex-number">#FFB3A7</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#F62459;">
    <span class="color-name">RADICAL RED</span><br>
    <span class="hex-number">#F62459</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#F58F84;">
    <span class="color-name">Ibis wing color</span><br>
    <span class="hex-number">#F58F84</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#875F9A;">
    <span class="color-name">Wisteria purple</span><br>
    <span class="hex-number">#875F9A</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#5D3F6A;">
    <span class="color-name">Bellflower color</span><br>
    <span class="hex-number">#5D3F6A</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#89729E;">
    <span class="color-name">Wisteria color</span><br>
    <span class="hex-number">#89729E</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#763568;">
    <span class="color-name">Iris color</span><br>
    <span class="hex-number">#763568</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#8D608C;">
    <span class="color-name">Tatarian aster color</span><br>
    <span class="hex-number">#8D608C</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#A87CA0;">
    <span class="color-name">Thin color</span><br>
    <span class="hex-number">#A87CA0</span><br>
   </div>
  </div>

   <div class="color-picker">
   <div class="color-item" style="background-color:#5B3256;">
    <span class="color-name">Violet color</span><br>
    <span class="hex-number">#5B3256</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#BF55EC;">
    <span class="color-name">MEDIUM PURPLE</span><br>
    <span class="hex-number">#BF55EC</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color: #8E44AD;">
    <span class="color-name">STUDIO</span><br>
    <span class="hex-number">#8E44AD</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#9B59B6;">
    <span class="color-name">WISTERIA</span><br>
    <span class="hex-number">#9B59B6</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#BE90D4;">
    <span class="color-name">LIGHT WISTERIA</span><br>
    <span class="hex-number">#BE90D4</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#4D8FAC;">
    <span class="color-name">Sky color</span><br>
    <span class="hex-number">#4D8FAC</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#5D8CAE;">
    <span class="color-name">Ultramarine color</span><br>
    <span class="hex-number">#5D8CAE</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#22A7F0;">
    <span class="color-name">PICTON BLUE</span><br>
    <span class="hex-number">#22A7F0</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#19B5FE;">
    <span class="color-name">DODGER BLUE</span><br>
    <span class="hex-number">#19B5FE</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#59ABE3;">
    <span class="color-name">PICTON BLUE</span><br>
    <span class="hex-number">#59ABE3</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#48929B;">
    <span class="color-name">Light blue color</span><br>
    <span class="hex-number">#48929B</span><br>
   </div>
  </div>

   <div class="color-picker">
   <div class="color-item" style="background-color:#317589;">
    <span class="color-name">Thousand herb</span><br>
    <span class="hex-number">#317589</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#89C4F4;">
    <span class="color-name">JORDY BLUE</span><br>
    <span class="hex-number">#89C4F4</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color: #4B77BE;">
    <span class="color-name">STEEL BLUE</span><br>
    <span class="hex-number">#4B77BE</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#1F4788;">
    <span class="color-name">Lapis lazuli color</span><br>
    <span class="hex-number">#1F4788</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#003171;">
    <span class="color-name">Navy blue color</span><br>
    <span class="hex-number">#003171</span><br>
   </div>
  </div>

   <div class="color-picker">
   <div class="color-item" style="background-color:#044F67;">
    <span class="color-name">Hanada</span><br>
    <span class="hex-number">#044F67</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color: #264348;">
    <span class="color-name">Indigo color</span><br>
    <span class="hex-number">#264348</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#7A942E;">
    <span class="color-name">Siskin sprout yellow</span><br>
    <span class="hex-number">#7A942E</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#8DB255;">
    <span class="color-name">young green onion</span><br>
    <span class="hex-number">#8DB255</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#5B8930;">
    <span class="color-name">Fresh onion</span><br>
    <span class="hex-number">#5B8930</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#6B9362;">
    <span class="color-name">Young bamboo color</span><br>
    <span class="hex-number">#6B9362</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#407A52;">
    <span class="color-name">Patina</span><br>
    <span class="hex-number">#407A52</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#006442;">
    <span class="color-name">Green bamboo</span><br>
    <span class="hex-number">#006442</span><br>
   </div>
  </div>

   <div class="color-picker">
   <div class="color-item" style="background-color:#87D37C;">
    <span class="color-name">GOSSIP</span><br>
    <span class="hex-number">#87D37C</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#26A65B;">
    <span class="color-name">EUCALYPTUS</span><br>
    <span class="hex-number">#26A65B</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color: #26C281;">
    <span class="color-name">JUNGLE GREEN</span><br>
    <span class="hex-number">#26C281</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#049372;">
    <span class="color-name">OBSERVATORY</span><br>
    <span class="hex-number">#049372</span><br>
   </div>
  </div>

  <div class="color-picker">
   <div class="color-item" style="background-color:#2ABB9B;">
    <span class="color-name">JUNGLE GREEN</span><br>
    <span class="hex-number">#2ABB9B</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#16A085;">
    <span class="color-name">MOUNTAIN MEADOW</span><br>
    <span class="hex-number">#16A085</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#36D7B7;">
    <span class="color-name">TURQUOISE</span><br>
    <span class="hex-number">#36D7B7</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color: #03A678;">
    <span class="color-name">FREE SPEECH AQUAMARINE</span><br>
    <span class="hex-number">#03A678</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#4DAF7C;">
    <span class="color-name">OCEAN GREEN</span><br>
    <span class="hex-number">#4DAF7C</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#D9B611;">
    <span class="color-name">Patrinia flowers</span><br>
    <span class="hex-number">#D9B611</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#F3C13A;">
    <span class="color-name">Amur cork tree</span><br>
    <span class="hex-number">#F3C13A</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#F7CA18;">
    <span class="color-name">RIPE LEMON</span><br>
    <span class="hex-number">#F7CA18</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#E2B13C;">
    <span class="color-name">Japanese triandra grass</span><br>
    <span class="hex-number">#E2B13C</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#A17917;">
    <span class="color-name">Rapeseed oil-colored</span><br>
    <span class="hex-number">#A17917</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#F5D76E;">
    <span class="color-name">CREAM CAN</span><br>
    <span class="hex-number">#F5D76E</span><br>
   </div>
  </div>

   <div class="color-picker">
   <div class="color-item" style="background-color:#F4D03F;">
    <span class="color-name">SAFFRON</span><br>
    <span class="hex-number">#F4D03F</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#FFA400;">
    <span class="color-name">Bright golden yellow</span><br>
    <span class="hex-number">#FFA400</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#E08A1E;">
    <span class="color-name">Sumac-dyed</span><br>
    <span class="hex-number">#E08A1E</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#FFB61E;">
    <span class="color-name">Gamboge</span><br>
    <span class="hex-number">#FFB61E</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#FAA945;">
    <span class="color-name">Corn-colored</span><br>
    <span class="hex-number">#FAA945</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#FFA631;">
    <span class="color-name">Egg-colored</span><br>
    <span class="hex-number">#FFA631</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#FFB94E;">
    <span class="color-name">Floral leaf-colored</span><br>
    <span class="hex-number">#FFB94E</span><br>
   </div>
  </div>

   <div class="color-picker">
   <div class="color-item" style="background-color:#E29C45;">
    <span class="color-name">Golden fallen leaves</span><br>
    <span class="hex-number">#E29C45</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#F9690E;">
    <span class="color-name">ECSTASY</span><br>
    <span class="hex-number">#F9690E</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color: #CA6924;">
    <span class="color-name">Amber</span><br>
    <span class="hex-number">#CA6924</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#F5AB35;">
    <span class="color-name">LIGHTNING YELLOW</span><br>
    <span class="hex-number">#F5AB35</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#BFBFBF;">
    <span class="color-name">SILVER</span><br>
    <span class="hex-number">#BFBFBF</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#F2F1EF;">
    <span class="color-name">CARARRA</span><br>
    <span class="hex-number">#F2F1EF</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#BDC3C7;">
    <span class="color-name">SILVER SAND</span><br>
    <span class="hex-number">#BDC3C7</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#ECF0F1;">
    <span class="color-name">PORCELAIN</span><br>
    <span class="hex-number">#ECF0F1</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#D2D7D3;">
    <span class="color-name">PUMICE</span><br>
    <span class="hex-number">#D2D7D3</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#757D75;">
    <span class="color-name">Harbor rat</span><br>
    <span class="hex-number">#757D75</span><br>
   </div>
  </div>

   <div class="color-picker">
   <div class="color-item" style="background-color:#EEEEEE;">
    <span class="color-name">GALLERY</span><br>
    <span class="hex-number">#EEEEEE</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color:#ABB7B7;">
    <span class="color-name">EDWARD</span><br>
    <span class="hex-number">#ABB7B7</span><br>
   </div>
  </div>
   <div class="color-picker">
   <div class="color-item" style="background-color: #6C7A89;">
    <span class="color-name">LYNCH</span><br>
    <span class="hex-number">#6C7A89</span><br>
   </div>
  </div>
  <div class="color-picker">
   <div class="color-item" style="background-color:#95A5A6;">
    <span class="color-name">CASCADE</span><br>
    <span class="hex-number">#95A5A6</span><br>
   </div>
  </div>
</div></div>
</div></div>

</body>
</html>
Semoga membantu
Penulis:

Seorang Penulis Asal Tegal jawa tengah 


PENTING !!!
Untuk pertanyaan di luar topik silahkan Gunakan Komentar Facebook atau Google+ sengaja Kami sediakan Untuk komentar random Dan untuk pertanyaan seputar article gunakan komentar disqus Terimakasih...

Disqus

Disqus comments:


Google+

Google+ comments:

Facebook

Facebook comments:

This site uses cookies from Google to deliver its services, to personalise ads and to analyse traffic. Information about your use of this site is shared with Google. By using this site, you agree to its use of cookies. Detail