十六进制颜色码大全，可以点击复制
Posted holdonBestrong
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了十六进制颜色码大全，可以点击复制相关的知识，希望对你有一定的参考价值。
平时做一些demo的时候，需要用到颜色，但是好多好看的颜色又记不住，所以做了一个demo，点击可以直接复制颜色的颜色码
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no"> <title>颜色代码大全</title> <style> *{margin:0;padding:0;} #container{width: 30%;height: 100%;float: left;} #content{width: 70%;height: 100%;float: left;} .box,.box2{text-align: center;line-height: 50px;float: left;height: 50px;font-size: 12px;color:#fff;text-shadow: 0 0 1px #000;} .box{width: 16.66%;} .box2{width: 6.66%;} #success{width: 200px;height: 40px;background:#ccff00;text-align: center;line-height: 40px;position: fixed;margin:auto;left: 0;right: 0;top: 100px;box-shadow: 0px 0px 2px 2px #ccff00;color: #fff;border-radius: 5px;-webkit-transition:all 0.5s;opacity: 0;text-shadow: 0 0 1px #000;} .show{ -webkit-animation:show 1s; } @keyframes show{ /*from, 60%, 75%, 90%, 100% { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); }*/ 0% { opacity: 1; -webkit-transform: translate3d(0, -3000px, 0); } 20% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); } 35% { -webkit-transform: translate3d(0, -10px, 0); } 50% { -webkit-transform: translate3d(0, 5px, 0); } 95% { -webkit-transform: translate3d(0, 5px, 0); } 100% { -webkit-transform: translate3d(0, -200px, 0); opacity: 1; } /*100% { -webkit-transform: none; transform: none; opacity: 1; }*/ } </style> </head> <body> <section id="container"> <div class="box" style="background:#ffff00;">#ffff00</div> <div class="box" style="background:#ffff33;">#ffff33</div> <div class="box" style="background:#ffff66;">#ffff66</div> <div class="box" style="background:#ffff99;">#ffff99</div> <div class="box" style="background:#ffffcc;">#ffffcc</div> <div class="box" style="background:#ffffff;">#ffffff</div> <div class="box" style="background:#ffcc00;">#ffcc00</div> <div class="box" style="background:#ffcc33;">#ffcc33</div> <div class="box" style="background:#ffcc66;">#ffcc66</div> <div class="box" style="background:#ffcc99;">#ffcc99</div> <div class="box" style="background:#ffcccc;">#ffcccc</div> <div class="box" style="background:#ffccff;">#ffccff</div> <div class="box" style="background:#ff9900;">#ff9900</div> <div class="box" style="background:#ff9933;">#ff9933</div> <div class="box" style="background:#ff9966;">#ff9966</div> <div class="box" style="background:#ff9999;">#ff9999</div> <div class="box" style="background:#ff99cc;">#ff99cc</div> <div class="box" style="background:#ff99ff;">#ff99ff</div> <div class="box" style="background:#ff6600;">#ff6600</div> <div class="box" style="background:#ff6633;">#ff6633</div> <div class="box" style="background:#ff6666;">#ff6666</div> <div class="box" style="background:#ff6699;">#ff6699</div> <div class="box" style="background:#ff66cc;">#ff66cc</div> <div class="box" style="background:#ff66ff;">#ff66ff</div> <div class="box" style="background:#ff3300;">#ff3300</div> <div class="box" style="background:#ff3333;">#ff3333</div> <div class="box" style="background:#ff3366;">#ff3366</div> <div class="box" style="background:#ff3399;">#ff3399</div> <div class="box" style="background:#ff33cc;">#ff33cc</div> <div class="box" style="background:#ff33ff;">#ff33ff</div> <div class="box" style="background:#ff0000;">#ff0000</div> <div class="box" style="background:#ff0033;">#ff0033</div> <div class="box" style="background:#ff0066;">#ff0066</div> <div class="box" style="background:#ff0099;">#ff0099</div> <div class="box" style="background:#ff00cc;">#ff00cc</div> <div class="box" style="background:#ff00ff;">#ff00ff</div> <div class="box" style="background:#ccff00;">#ccff00</div> <div class="box" style="background:#ccff33;">#ccff33</div> <div class="box" style="background:#ccff66;">#ccff66</div> <div class="box" style="background:#ccff99;">#ccff99</div> <div class="box" style="background:#ccffcc;">#ccffcc</div> <div class="box" style="background:#ccffff;">#ccffff</div> <div class="box" style="background:#cccc00;">#cccc00</div> <div class="box" style="background:#cccc33;">#cccc33</div> <div class="box" style="background:#cccc66;">#cccc66</div> <div class="box" style="background:#cccc99;">#cccc99</div> <div class="box" style="background:#cccccc;">#cccccc</div> <div class="box" style="background:#ccccff;">#ccccff</div> <div class="box" style="background:#cc9900;">#cc9900</div> <div class="box" style="background:#cc9933;">#cc9933</div> <div class="box" style="background:#cc9966;">#cc9966</div> <div class="box" style="background:#cc9999;">#cc9999</div> <div class="box" style="background:#cc99cc;">#cc99cc</div> <div class="box" style="background:#cc99ff;">#cc99ff</div> <div class="box" style="background:#cc6600;">#cc6600</div> <div class="box" style="background:#cc6633;">#cc6633</div> <div class="box" style="background:#cc6666;">#cc6666</div> <div class="box" style="background:#cc6699;">#cc6699</div> <div class="box" style="background:#cc66cc;">#cc66cc</div> <div class="box" style="background:#cc66ff;">#cc66ff</div> <div class="box" style="background:#cc3300;">#cc3300</div> <div class="box" style="background:#cc3333;">#cc3333</div> <div class="box" style="background:#cc3366;">#cc3366</div> <div class="box" style="background:#cc3399;">#cc3399</div> <div class="box" style="background:#cc33cc;">#cc33cc</div> <div class="box" style="background:#cc33ff;">#cc33ff</div> <div class="box" style="background:#cc0000;">#cc0000</div> <div class="box" style="background:#cc0033;">#cc0033</div> <div class="box" style="background:#cc0066;">#cc0066</div> <div class="box" style="background:#cc0099;">#cc0099</div> <div class="box" style="background:#cc00cc;">#cc00cc</div> <div class="box" style="background:#cc00ff;">#cc00ff</div> <div class="box" style="background:#99ff00;">#99ff00</div> <div class="box" style="background:#99ff33;">#99ff33</div> <div class="box" style="background:#99ff66;">#99ff66</div> <div class="box"Python 颜色代码大全