十六进制到RGB颜色转换器/title> <meta name="description" content="十六进制到RGB颜色代码转换。"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/css/bootstrap.min.css" > <style> h1 { font-size:1.6rem; } h2 { font-size:1.4rem; } h4 { font-size:1.2rem; } #calcform { background:#f0f0f0; padding:20px; max-width:500px; } #calcform button img { filter: invert(1); }</style>  <link rel="canonical" href="https://www.titaotie.com/convert/color/hex-to-rgb.html" /> <script async src="../../assets/js/coun-w3.js" ></script>  <script async src="https://www.googletagmanager.com/gtag/js?id=G-3LS30VWYXF"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-3LS30VWYXF'); </script> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1832854270693044" crossorigin="anonymous"></script> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?ac0ee223cbf63018bf5c2c97c286c454"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> <meta name="dateModified" content="2026-05-15"> </head> <body> <div id="header"> <div> <div id="logo" class="box"> <p> <a href="../../index.htm">无涯在线工具箱</a> </p> </div> </div> </div> <div id="wrapper"> <div id="nav">  <a href="../../index.htm">首页</a> /<a href="../index.html">转换</a>/<a href="index.html">颜色转换</a>/十六进制<a href="index.html">转换</a>为RGB </div> <div id="top-ad"> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-1832854270693044" data-ad-slot="2671835991" data-ad-format="auto" data-full-width-responsive="true"></ins> </div> <div id="lcol"> <div id="doc">  <p class="doc-update">最后修改时间：2026年5月15日</p> <h1>十六进制到RGB颜色转换器</h1> <p>输入6位十六进制颜色代码，然后i>转换</i>按钮。</p> <form id="calcform" name="calcform" autocomplete="off"> <div class="form-group"> <label for="hex">十六进制颜色代码RRGGBB</label> <input type="text" id="hex" name="hex" placeholder="000000" minlength="3" maxlength="8" class="form-control form-control-lg" autofocus> </div> <div class="form-group"> <button type="button" title="转换" class="btn btn-primary" onclick="calc()"><img src="../../assets/lib/icons/glyphicons_all/glyphicons_halflings/glyphicons_halflings_030_refresh.png" tppabs="https://www.titaotie.com/assets/lib/icons/glyphicons_all/glyphicons_halflings/glyphicons_halflings-030-refresh.png" alt=""> 转换</button> <button type="reset" title="重置" class="btn btn-secondary" onclick="clr()"><img src="../../assets/lib/icons/glyphicons_all/glyphicons_halflings/glyphicons_halflings_013_remove.png" tppabs="https://www.titaotie.com/assets/lib/icons/glyphicons_all/glyphicons_halflings/glyphicons_halflings-013-remove.png" alt=""> 重置</button> <button type="button" title="交换转换" class="btn btn-secondary" onclick="location.href='rgb-to-hex.html'/*tpa=https://www.titaotie.com/convert/color/rgb-to-hex.html*/;"><img src="../../assets/lib/icons/glyphicons_all/glyphicons_halflings/glyphicons_halflings_114_retweet.png" tppabs="https://www.titaotie.com/assets/lib/icons/glyphicons_all/glyphicons_halflings/glyphicons_halflings-114-retweet.png" alt=""> 交换</button> </div> <div class="form-group"> <label for="r">红色（R</label> <input type="text" id="r" name="r" class="form-control form-control-lg" readonly> </div> <div class="form-group"> <label for="g">绿（G</label> <input type="text" id="g" name="g" class="form-control form-control-lg" readonly> </div> <div class="form-group"> <label for="b">蓝色（B</label> <input type="text" id="b" name="b" class="form-control form-control-lg" readonly> </div> <div class="form-group"> <label for="css">CSS颜色</label> <input type="text" id="css" name="css" class="form-control form-control-lg" readonly> </div> <div class="form-group"> <label for="color">色彩预览</label> <input type="text" id="color" name="color" class="form-control" style="height:70px; border:1px solid black" readonly> </div> </form> <p><a href="rgb-to-hex.html">RGB转十六进制转换器</a></p> <h2>十六进制到RGB颜色表</h2> <table class="dtable"> <tr> <th>颜色</th> <th>颜色<p>名称</th> <th>十六进制</th> <th>（R，G，B）</th> </tr> <tr> <td style="background-color:#000000"> </td> <td>黑色</td> <td>00000</td> <td>,0,0）</td> </tr> <tr> <td style="background-color:#FFFFFF"> </td> <td>白色</td> <td>#FFFFFF</td> <td>55,255,255）</td> </tr> <tr> <td style="background-color:#FF0000"> </td> <td>红色</td> <td>＃FF0000</td> <td>55,0,0）</td> </tr> <tr> <td style="background-color:#00FF00"> </td> <td>酸橙</td> <td>0FF00</td> <td>,255,0）</td> </tr> <tr> <td style="background-color:#0000FF"> </td> <td>蓝色</td> <td>000FF</td> <td>,0,255）</td> </tr> <tr> <td style="background-color:#FFFF00"> </td> <td>黄色</td> <td>＃FFFF00</td> <td>55,255,0）</td> </tr> <tr> <td style="background-color:#00FFFF"> </td> <td>青色</td> <td>0FFFF</td> <td>,255,255）</td> </tr> <tr> <td style="background-color:#FF00FF"> </td> <td>品红</td> <td>＃FF00FF</td> <td>55,0,255）</td> </tr> <tr> <td style="background-color:#C0C0C0"> </td> <td></td> <td>＃C0C0C0</td> <td>92,192,192）</td> </tr> <tr> <td style="background-color:#808080"> </td> <td>灰色</td> <td>08080</td> <td>28,128,128）</td> </tr> <tr> <td style="background-color:#800000"> </td> <td>栗色</td> <td>00000</td> <td>28,0,0）</td> </tr> <tr> <td style="background-color:#808000"> </td> <td>橄榄</td> <td>08000</td> <td>28,128,0）</td> </tr> <tr> <td style="background-color:#008000"> </td> <td>绿色</td> <td>08000</td> <td>,128,0）</td> </tr> <tr> <td style="background-color:#800080"> </td> <td>紫色</td> <td>00080</td> <td>28,0,128）</td> </tr> <tr> <td style="background-color:#008080"> </td> <td>蓝绿色</td> <td>08080</td> <td>,128,128）</td> </tr> <tr> <td style="background-color:#000080"> </td> <td>海军</td> <td>00080</td> <td>,0,128）</td> </tr> </table> <h3>十六进制到RGB转换</h3> <ol> <li>获取十六进制颜色代码的左两位，然后转换为十进制值以获取红色级别。</li> <li>获取十六进制颜色代码的两位中位数，并将其转换为十进制值以获取绿色级别。</li> <li>获取十六进制颜色代码的右两位，然后转换为十进制值以获取蓝色级别。</li> </ol> <h4>例子1</h4> <p>将红色十六进制颜色代码FF0000转换为RGB颜色。</p> <p class="math"><i>十六进制</i>= FF0000</p> <p>因此，RGB颜色为：</p> <p class="math"><i>R</i> = FF <sub><span style="font-size: 0.8em">16</span></sub> = 255 <sub><span style="font-size: 0.8em">10</span></sub></p> <p class="math"><i>G</i> = 00 <sub><span style="font-size: 0.8em">16</span></sub> = 0 <sub><span style="font-size: 0.8em">10</span></sub></p> <p class="math"><i>B</i> = 00 <sub><span style="font-size: 0.8em">16</span></sub> = 0 <sub><span style="font-size: 0.8em">10</span></sub></p> <p></p> <p class="math"><i>RGB</i> =55。</p> <h4>范例</h4> <p>将金十六进制颜色代码FFD700转换为RGB颜色。</p> <p class="math"><i>十六进制</i>= FFD700</p> <p>因此，RGB颜色为：</p> <p class="math"><i>R</i> = FF <sub><span style="font-size: 0.8em">16</span></sub> = 255 <sub><span style="font-size: 0.8em">10</span></sub></p> <p class="math"><i>G</i> = D7 <sub><span style="font-size: 0.8em">16</span></sub> = 215 <sub><span style="font-size: 0.8em">10</span></sub></p> <p class="math"><i>B</i> = 00 <sub><span style="font-size: 0.8em">16</span></sub> = 0 <sub><span style="font-size: 0.8em">10</span></sub></p> <p></p> <p class="math"><i>RGB</i> =55。15。。</p> <p> </p> <p><a href="rgb-to-hex.html">RGB到十六进制的转换</a></p> <p> </p> <div id="bottom-ad_2"> </div><hr> <h2>另请参阅</h2> <ul class="seealso"> <li><a href="how-hex-to-rgb.html">如何将十六进制转换为RGB</a></li> <li><a href="rgb-to-hex.html">RGB到十六进制转换器</a></li> <li><a href="../number/hex-to-decimal.html">十六进制到十进制转换器</a></li> <li><a href="../../web/color/rgb-color.html">RGB颜色代码</a></li> </ul> <script> function clr() { document.calcform.reset(); document.calcform.color.style.backgroundColor="#FFFFFF"; } function calc() { var r,g,b,a=""; hex = document.calcform.hex.value; if( hex=="" ) hex="000000"; if( hex.charAt(0)=="#" ) hex=hex.substring(1,hex.length); if( hex.length!=6 && hex.length!=8 && hex.length!=3 ) { alert("Please enter 6 digits color code !"); return; } if( hex.length==3 ) { r = hex.substring(0,1); g = hex.substring(1,2); b = hex.substring(2,3); r=r+r; g=g+g; b=b+b; } else { r = hex.substring(0,2); g = hex.substring(2,4); b = hex.substring(4,6); } if( hex.length==8 ) { a = hex.substring(6,8); a = (parseInt(a, 16)/255.0).toFixed(2); } r = parseInt(r, 16); g = parseInt(g, 16); b = parseInt(b, 16); var css="rgb("+r+", "+g+", "+b+")"; if( hex.length==8 ) css="rgba("+r+", "+g+", "+b+", "+a+")"; document.calcform.r.value = r; document.calcform.g.value = g; document.calcform.b.value = b; document.calcform.css.value = css; document.calcform.color.style.backgroundColor='#'+hex; } </script>  <div id="ban-ad"> </div>   </div> </div> <div id="rcol"> <p style="text-align: center;font-size: 13px;">广告</p> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-1832854270693044" data-ad-slot="6938384069" data-ad-format="auto" data-full-width-responsive="true"></ins>  <h5>颜色转换</h5> <ul> <li><a href="cmyk-to-rgb.html">CMYK转RGB</a></li> <li><a href="hex-to-rgb.html">十六进制转RGB</a></li> <li><a href="hsl-to-rgb.html">HSL转RGB</a></li> <li><a href="hsv-to-rgb.html">HSV到RGB</a></li> <li><a href="rgb-to-cmyk.html">RGB到CMYK</a></li> <li><a href="rgb-to-hex.html">RGB转十六进</a></li> <li><a href="rgb-to-hsl.html">RGB转HSL</a></li> <li><a href="rgb-to-hsv.html">RGB到HSV</a></li> </ul> <h5>快速表格</h5> <ul> <li><a href="mailto:?subject=无涯在线工具箱%20website&body=请查看这个网站:%20https://www.titaotie.com">推荐网站</a></li> <li><a href="#feedback">发送反馈</a></li> <li><a href="../../about/about.html">关于</a></li> </ul>  </div> </div> <div id="footer"> <a href="../../index.htm">首页</a>| <a href="../../web/index.html">网页</a>| <a href="../../math/index.html">数学</a>| <a href="../../electric/index.html">电力</a>| <a href="../../calc/index.html">计算器</a>| <a href="../index.html">转换器</a>| <a href="../../tools/index.html">工具类</a> <p>© 2026 <a href="../../index.htm">无涯在线工具箱</a> | <a href="../../about/about.html" rel="nofollow">关于</a>| <a href="../../about/terms.html" rel="nofollow">使用条款</a>| <a href="../../about/privacy.html" rel="nofollow">隐私政策</a>| <a href="../../about/cookies.html" rel="nofollow">管理 Cookie</a> </p> </div> <div id="banner"> <div> 该网站使用 Cookie 来改善你的体验，分析流量并展示广告。<a href="../../about/privacy.html">了解更多</a> </div> <div> <a id="banokbtn">确定</a> <a id="bansetbtn" href="../../about/cookies.html">管理设置</a> </div> </div>   </body>  </html>