[{"data":1,"prerenderedAt":702},["ShallowReactive",2],{"blog-post-/blog/zh-cn/how-to-convert-hex-to-rgb-online":3,"related-posts-/zh-CN/blog/how-to-convert-hex-to-rgb-online":156},{"id":4,"title":5,"author":6,"body":7,"category":137,"date":138,"description":139,"extension":140,"featured":141,"image":142,"meta":143,"navigation":144,"path":145,"readingTime":146,"seo":147,"stem":148,"tags":149,"tools":154,"__hash__":155},"content/blog/zh-CN/how-to-convert-hex-to-rgb-online.md","如何在线将 HEX 转换为 RGB","Anything Tools Editorial",{"type":8,"value":9,"toc":130},"minimark",[10,14,23,28,54,58,83,86,92,119,127],[11,12,13],"p",{},"将 HEX 转换为 RGB 是 Web 开发者和设计师的常见任务。无论您是将品牌调色板转换为 CSS 代码，还是微调设计元素，一款在线颜色转换器都能让这个过程变得无比轻松。",[11,15,16,17,22],{},"在本指南中，我们将探讨什么是 HEX 和 RGB，为什么需要在它们之间进行转换，以及如何使用我们免费的",[18,19,21],"a",{"href":20},"/design/color-converter","颜色转换器","快速完成转换。",[24,25,27],"h2",{"id":26},"什么是-hex-和-rgb","什么是 HEX 和 RGB？",[29,30,31,44],"ul",{},[32,33,34,38,39,43],"li",{},[35,36,37],"strong",{},"HEX (十六进制)："," 用于网页设计中表示颜色的 6 位代码（例如 ",[40,41,42],"code",{},"#FF0000"," 代表红色）。它常用于 CSS 和 HTML 中。",[32,45,46,49,50,53],{},[35,47,48],{},"RGB (红绿蓝)："," 一种基于红、绿、蓝光组合定义颜色的色彩模式（例如 ",[40,51,52],{},"rgb(255, 0, 0)"," 代表红色）。常用于数字屏幕显示和现代 CSS 开发。",[24,55,57],{"id":56},"为什么需要将-hex-转为-rgb","为什么需要将 HEX 转为 RGB？",[59,60,61,71,77],"ol",{},[32,62,63,66,67,70],{},[35,64,65],{},"CSS 变量与透明度："," 使用 ",[40,68,69],{},"rgba()"," 可以轻松设置不透明度（Alpha 通道），但这需要您先获得 RGB 值。",[32,72,73,76],{},[35,74,75],{},"设计软件兼容："," 某些特定的设计工具或旧版应用程序仅接受 RGB 值输入。",[32,78,79,82],{},[35,80,81],{},"程序化控制："," 如果您要编写动画或动态 UI，在 JavaScript 中使用 RGB 数组进行颜色计算比解析 HEX 字符串要简单得多。",[24,84,85],{"id":85},"如何使用在线颜色转换器",[11,87,88,89,91],{},"我们的",[18,90,21],{"href":20},"提供直观且无广告的界面，支持色彩的自由互转。",[59,93,94,102,109,112],{},[32,95,96,97,101],{},"访问 ",[35,98,99],{},[18,100,21],{"href":20}," 页面。",[32,103,104,105,108],{},"在输入框中粘贴您的 HEX 代码（例如 ",[40,106,107],{},"#3498db","）。",[32,110,111],{},"工具将立即显示对应的 RGB 值，并同步提供 HSL 和 CMYK 格式。",[32,113,114,115,118],{},"点击复制图标，即可将格式化好的 ",[40,116,117],{},"rgb(x, y, z)"," 字符串复制到剪贴板。",[11,120,121,122,126],{},"您还可以结合我们的",[18,123,125],{"href":124},"/design/color-picker","颜色选择器","功能，可视化地挑选颜色并同时查看其所有格式的值。",[11,128,129],{},"立即体验，加速您的网页设计工作流！",{"title":131,"searchDepth":132,"depth":132,"links":133},"",2,[134,135,136],{"id":26,"depth":132,"text":27},{"id":56,"depth":132,"text":57},{"id":85,"depth":132,"text":85},"Design","2026-04-29T00:00:00.000Z","了解如何使用我们免费的在线颜色转换工具，快速将 HEX 颜色代码转换为 RGB 值。","md",false,"/blog/how-to-convert-hex-to-rgb-online.png",{},true,"/blog/zh-cn/how-to-convert-hex-to-rgb-online",null,{"title":5,"description":139},"blog/zh-CN/how-to-convert-hex-to-rgb-online",[150,151,152,153],"Color Converter","HEX to RGB","Web Design","CSS",[20,124],"PfKpWyimrchaNzu2TnFrLtR6PyyC-XLMJ7TKneZYhkY",[157,608],{"id":158,"title":159,"author":160,"body":161,"category":137,"date":592,"description":593,"extension":140,"featured":141,"image":594,"meta":595,"navigation":144,"path":596,"readingTime":597,"seo":598,"stem":599,"tags":600,"tools":606,"__hash__":607},"content/blog/de-DE/best-free-color-picker-tools-online.md","Die Besten Kostenlosen Online-Farbwähler-Tools in 2026","Anything Tools Team",{"type":8,"value":162,"toc":575},[163,167,170,173,177,215,219,224,233,240,245,268,275,279,285,291,295,300,303,307,312,315,319,502,506,510,517,521,541,545,550,554,561],[164,165,159],"h1",{"id":166},"die-besten-kostenlosen-online-farbwähler-tools-in-2026",[11,168,169],{},"Farbe ist eines der mächtigsten Elemente im Design. Der richtige Blauton vermittelt Vertrauen, das falsche Grün kann einen „Jetzt kaufen\"-Button unsichtbar machen, und eine schlecht gewählte Hintergrundfarbe kann Ihren Text komplett unleserlich machen. Ob Sie ein UI-Designer sind, der eine Markenpalette verfeinert, ein Frontend-Entwickler, der HEX-Codes für CSS braucht, oder ein Content-Creator, der Akzentfarben wählt — Sie brauchen ein zuverlässiges Farbwähler-Tool.",[11,171,172],{},"In diesem Guide vergleichen wir die besten kostenlosen Online-Farbwähler in 2026.",[24,174,176],{"id":175},"kriterien-für-einen-hervorragenden-farbwähler","Kriterien für einen Hervorragenden Farbwähler",[59,178,179,185,191,197,203,209],{},[32,180,181,184],{},[35,182,183],{},"Unterstützung mehrerer Farbformate:"," HEX, RGB, HSL, CMYK und mehr.",[32,186,187,190],{},[35,188,189],{},"Visuelle Präzision:"," Ein gut gestalteter Farb-Gradient und Farbton-Schieberegler.",[32,192,193,196],{},[35,194,195],{},"Palettengenerierung:"," Automatische Generierung von Komplementär-, Analogie-, Triadischen Farbschemata.",[32,198,199,202],{},[35,200,201],{},"WCAG-Barrierefreiheitsprüfung:"," Überprüfung der Kontrastverhältnisse.",[32,204,205,208],{},[35,206,207],{},"Kein Konto oder Installation nötig:"," Funktioniert sofort im Browser.",[32,210,211,214],{},[35,212,213],{},"Datenschutz:"," Keine Daten werden an einen Server gesendet.",[24,216,218],{"id":217},"unsere-top-empfehlungen-für-2026","Unsere Top-Empfehlungen für 2026",[220,221,223],"h3",{"id":222},"_1-anything-tools-color-picker","1. Anything Tools Color Picker",[11,225,226,229,230],{},[35,227,228],{},"Webseite:"," ",[18,231,232],{"href":124},"anything.tools/design/color-picker",[11,234,235,236,239],{},"Unser Farbwähler wurde mit einer Philosophie entwickelt: ",[35,237,238],{},"Alle wesentlichen Funktionen bereitstellen, ohne dass Daten Ihren Browser verlassen."," Jede Farbberechnung, Palettengenerierung und Barrierefreiheitsprüfung läuft zu 100 % clientseitig.",[11,241,242],{},[35,243,244],{},"Hauptfunktionen:",[29,246,247,250,253,256,259,262,265],{},[32,248,249],{},"Echtzeit-Ausgabe in HEX, RGB, HSL und CMYK",[32,251,252],{},"Visueller Farbwähler mit Gradientenfläche und Farbton-Schieberegler",[32,254,255],{},"Ein-Klick-Kopie für alle Formate",[32,257,258],{},"Integrierter WCAG-Kontrastprüfer",[32,260,261],{},"Komplementär-, Analogie-, Triadische und Split-Komplementär-Paletten",[32,263,264],{},"Keine Werbung, keine Registrierung, kein Tracking",[32,266,267],{},"Funktioniert nach dem Laden komplett offline",[11,269,270,271,274],{},"Für erweiterte Formatkonvertierungen nutzen Sie auch unseren dedizierten ",[18,272,273],{"href":20},"Farbkonverter",".",[220,276,278],{"id":277},"_2-google-color-picker","2. Google Color Picker",[11,280,281,284],{},[35,282,283],{},"Zugang:"," Suchen Sie „color picker\" bei Google. Der integrierte Farbwähler erscheint direkt in den Suchergebnissen.",[11,286,287,290],{},[35,288,289],{},"Einschränkungen:"," Kein HSL/CMYK, keine Palettengenerierung, keine WCAG-Prüfung.",[220,292,294],{"id":293},"_3-coolors","3. Coolors",[11,296,297,299],{},[35,298,228],{}," coolors.co",[11,301,302],{},"Beliebtes Palettengenerierungs-Tool. Stärke liegt in der schnellen Erstellung von 5-Farben-Paletten.",[220,304,306],{"id":305},"_4-adobe-color","4. Adobe Color",[11,308,309,311],{},[35,310,228],{}," color.adobe.com",[11,313,314],{},"Das Branchenstandard-Paletten-Tool, integriert in das Adobe-Ökosystem.",[24,316,318],{"id":317},"vergleichstabelle","Vergleichstabelle",[320,321,322,344],"table",{},[323,324,325],"thead",{},[326,327,328,332,335,338,341],"tr",{},[329,330,331],"th",{},"Funktion",[329,333,334],{},"Anything Tools",[329,336,337],{},"Google",[329,339,340],{},"Coolors",[329,342,343],{},"Adobe Color",[345,346,347,364,380,395,410,425,441,456,472,487],"tbody",{},[326,348,349,355,358,360,362],{},[350,351,352],"td",{},[35,353,354],{},"HEX/RGB",[350,356,357],{},"✅",[350,359,357],{},[350,361,357],{},[350,363,357],{},[326,365,366,371,373,376,378],{},[350,367,368],{},[35,369,370],{},"HSL",[350,372,357],{},[350,374,375],{},"❌",[350,377,357],{},[350,379,357],{},[326,381,382,387,389,391,393],{},[350,383,384],{},[35,385,386],{},"CMYK",[350,388,357],{},[350,390,375],{},[350,392,375],{},[350,394,357],{},[326,396,397,402,404,406,408],{},[350,398,399],{},[35,400,401],{},"Visueller Wähler",[350,403,357],{},[350,405,357],{},[350,407,357],{},[350,409,357],{},[326,411,412,417,419,421,423],{},[350,413,414],{},[35,415,416],{},"Palettengenerierung",[350,418,357],{},[350,420,375],{},[350,422,357],{},[350,424,357],{},[326,426,427,432,434,436,439],{},[350,428,429],{},[35,430,431],{},"WCAG-Kontrast",[350,433,357],{},[350,435,375],{},[350,437,438],{},"Eingeschränkt",[350,440,357],{},[326,442,443,448,450,452,454],{},[350,444,445],{},[35,446,447],{},"Offline-Support",[350,449,357],{},[350,451,375],{},[350,453,375],{},[350,455,375],{},[326,457,458,463,465,467,470],{},[350,459,460],{},[35,461,462],{},"Kein Konto nötig",[350,464,357],{},[350,466,357],{},[350,468,469],{},"Teilweise",[350,471,375],{},[326,473,474,479,481,483,485],{},[350,475,476],{},[35,477,478],{},"Datenschutz (clientseitig)",[350,480,357],{},[350,482,375],{},[350,484,375],{},[350,486,375],{},[326,488,489,494,496,498,500],{},[350,490,491],{},[35,492,493],{},"Kostenlos",[350,495,357],{},[350,497,357],{},[350,499,469],{},[350,501,469],{},[24,503,505],{"id":504},"professionelle-tipps-zur-farbwahl","Professionelle Tipps zur Farbwahl",[220,507,509],{"id":508},"_1-starten-sie-mit-barrierefreiheit","1. Starten Sie mit Barrierefreiheit",[11,511,512,513,516],{},"Prüfen Sie immer zuerst das Kontrastverhältnis. WCAG 2.1 erfordert mindestens 4,5:1 für normalen Text. Unser ",[18,514,515],{"href":124},"Farbwähler"," zeigt Kontrastwerte in Echtzeit an.",[220,518,520],{"id":519},"_2-die-60-30-10-regel","2. Die 60-30-10-Regel",[29,522,523,529,535],{},[32,524,525,528],{},[35,526,527],{},"60 %"," für die dominante/Hintergrundfarbe",[32,530,531,534],{},[35,532,533],{},"30 %"," für die Sekundärfarbe",[32,536,537,540],{},[35,538,539],{},"10 %"," für die Akzentfarbe",[220,542,544],{"id":543},"_3-präzise-formatkonvertierung","3. Präzise Formatkonvertierung",[11,546,547,548,274],{},"Für pixelgenaue Farbkonsistenz zwischen CSS, Druck und Designdateien nutzen Sie unseren ",[18,549,273],{"href":20},[24,551,553],{"id":552},"fazit","Fazit",[11,555,556,557,560],{},"2026 gibt es ausgezeichnete kostenlose Farbwähler für jeden Workflow. Unser ",[18,558,559],{"href":124},"Anything Tools Color Picker"," bietet die beste Kombination aus Funktionen, Datenschutz und Geschwindigkeit — alles in Ihrem Browser, ohne Tracking, ohne Konto und ohne Einschränkungen.",[11,562,563,564,569,570],{},"👉 ",[35,565,566],{},[18,567,568],{"href":124},"Testen Sie unseren kostenlosen Farbwähler"," | ",[35,571,572],{},[18,573,574],{"href":20},"Konvertieren Sie Farben zwischen Formaten",{"title":131,"searchDepth":132,"depth":132,"links":576},[577,578,585,586,591],{"id":175,"depth":132,"text":176},{"id":217,"depth":132,"text":218,"children":579},[580,582,583,584],{"id":222,"depth":581,"text":223},3,{"id":277,"depth":581,"text":278},{"id":293,"depth":581,"text":294},{"id":305,"depth":581,"text":306},{"id":317,"depth":132,"text":318},{"id":504,"depth":132,"text":505,"children":587},[588,589,590],{"id":508,"depth":581,"text":509},{"id":519,"depth":581,"text":520},{"id":543,"depth":581,"text":544},{"id":552,"depth":132,"text":553},"2026-04-18T00:00:00.000Z","Entdecken Sie die besten kostenlosen Online-Farbwähler für Designer und Entwickler. Vergleichen Sie Funktionen, Formate und Barrierefreiheitsprüfungen.","/blog/best-free-color-picker-tools-online.png",{},"/blog/de-de/best-free-color-picker-tools-online",7,{"title":159,"description":593},"blog/de-DE/best-free-color-picker-tools-online",[515,601,602,603,604,370,605],"Design-Tools","Webdesign","HEX","RGB","Barrierefreiheit",[124,20],"kKBFT0KreAesSzAq2z9iZO2ReshD9QoDaJc2AC9Jf2s",{"id":609,"title":610,"author":6,"body":611,"category":137,"date":688,"description":689,"extension":140,"featured":141,"image":690,"meta":691,"navigation":144,"path":692,"readingTime":146,"seo":693,"stem":694,"tags":695,"tools":700,"__hash__":701},"content/blog/de-DE/favicon-generator-complete-guide.md","Favicon-Generator Leitfaden: Größen, Formate und Browser-Tipps",{"type":8,"value":612,"toc":681},[613,616,619,623,631,635,638,642,662,666,674,678],[164,614,610],{"id":615},"favicon-generator-leitfaden-größen-formate-und-browser-tipps",[11,617,618],{},"Dieser Leitfaden ist für Menschen gedacht, die ein praktisches Ergebnis brauchen und keine reine Theorie. Ziel ist es, das richtige Browser-Tool zu wählen, die Ausgabe lesbar zu halten und Nacharbeit zu vermeiden.",[24,620,622],{"id":621},"mit-einfacher-grafik-beginnen","Mit einfacher Grafik beginnen",[11,624,625,626,630],{},"Nutze die verlinkten Anything-Tools-Seiten, wenn du einen privaten und schlanken Ablauf möchtest. Unterstützte Werkzeuge verarbeiten Dateien im Browser, danach kannst du weiter verkleinern oder komprimieren. Use ",[18,627,629],{"href":628},"/design/favicon-generator","Favicon Generator"," when the page itself needs to become an image, then compare the result with your real publishing target.",[24,632,634],{"id":633},"empfohlene-favicon-größen","Empfohlene Favicon-Größen",[11,636,637],{},"Lege zuerst fest, wofür das Bild verwendet wird. Ein Screenshot für Dokumentation, ein Website-Icon und ein Produktbild benötigen unterschiedliche Kompromisse bei Größe, Transparenz und Schärfe. If the exported asset must keep sharp text, flat graphics, or transparent edges, test it before choosing a smaller file.",[24,639,641],{"id":640},"kontrast-vor-dem-export-prüfen","Kontrast vor dem Export prüfen",[59,643,644,650,656,659],{},[32,645,646,647,649],{},"Open ",[18,648,629],{"href":628}," and export a sample page.",[32,651,652,653,274],{},"If you need another format, continue with ",[18,654,655],{"href":124},"Color Picker",[32,657,658],{},"Resize or compress only after checking readability.",[32,660,661],{},"Keep the original file until the final image has been approved.",[24,663,665],{"id":664},"wo-jedes-icon-verwendet-wird","Wo jedes Icon verwendet wird",[11,667,668,669,673],{},"Prüfe nach dem Export die wichtigsten Details vergrößert. Text, Linien, Logos und transparente Kanten zeigen Qualitätsprobleme schneller als eine Dateigröße allein. For sharing by email, documentation, or CMS upload, run a final pass through ",[18,670,672],{"href":671},"/image/resizer","Image Resizer"," only when the visual result still looks clean.",[24,675,677],{"id":676},"abschließende-checkliste","Abschließende Checkliste",[11,679,680],{},"Wenn das erste Ergebnis nicht passt, ändere immer nur eine Einstellung. So erkennst du leichter, ob Quelle, Format, Kompression oder Abmessungen das Problem verursachen. Save the final version with a descriptive file name, and add the related tool link in your internal checklist so the same workflow can be repeated later.",{"title":131,"searchDepth":132,"depth":132,"links":682},[683,684,685,686,687],{"id":621,"depth":132,"text":622},{"id":633,"depth":132,"text":634},{"id":640,"depth":132,"text":641},{"id":664,"depth":132,"text":665},{"id":676,"depth":132,"text":677},"2026-06-17T00:00:00.000Z","Erstelle ein zuverlässiges Favicon-Set, wähle die Ausgangsgrafik, prüfe den Kontrast bei kleinen Größen und bereite Icons für moderne Browser vor.","/blog/favicon-generator-complete-guide.png",{},"/blog/de-de/favicon-generator-complete-guide",{"title":610,"description":689},"blog/de-DE/favicon-generator-complete-guide",[696,697,698,699],"Favicon","Design Tools","Branding","Website Assets",[628,124,671],"T4CSDmhQwSwJYOoHHgPNtMN-0glBpXVwvzhMGlrHzto",1781687088686]