Benannte Farbe in HEX umwandeln

• Sofortiges Nachschlagen benannter Farben: Der Konverter aktualisiert alle Werte bei jedem Tastendruck – kein Knopf nötig. Beginnen Sie, eine benannte CSS-Farbe zu tippen, und die Autovervollständigung filtert sofort alle 148 benannten CSS-Farben. Wählen Sie eine aus, um HEX, RGB, HSL, Luminanz und die einzelnen Kanalwerte sofort zu sehen.
• Intelligente Autovervollständigungssuche: Der Konverter unterstützt unscharfe und partielle Übereinstimmungen. Tippen Sie „blue“ und sehen alle blaustichigen Farben, oder „rebecca“, um rebeccapurple zu finden. Die Suche umfasst sowohl den CSS-Namen (cornflowerblue) als auch den Anzeigenamen (Cornflower Blue) – maximal flexibel.
• 100 % privat – kein Upload: Die gesamte Umwandlung findet lokal in Ihrem Browser statt. Ihre Farbwerte verlassen Ihr Gerät nie und werden nie an einen Server gesendet – sicher für Kundenprojekte und proprietäre Designsysteme. Die gesamte Datenbank der benannten CSS-Farben ist in die Seite integriert.
• Kostenlos und ohne Limits: Schlagen Sie unbegrenzt benannte Farben nach, ohne Anmeldung, Abo oder Nutzungsgrenzen. Der Konverter ist für immer völlig kostenlos, ohne Werbung, die die Oberfläche blockiert.

• CSS-Entwicklung und Prototyping: Webentwickler nutzen den Konverter, um beim Prototyping schnell benannte CSS-Farben nachzuschlagen. Statt Hex-Codes auswendig zu lernen, tippen Sie natürliche Namen wie „coral“ oder „rebeccapurple“ ein und erhalten die exakten HEX-, RGB- und HSL-Werte für Ihre Stylesheets.
• Design-Übergabe und Kommunikation: Designer und Entwickler nutzen den Konverter, wenn sie Farbspezifikationen kommunizieren. Benannte CSS-Farben bieten ein gemeinsames Vokabular – „nutze mediumseagreen für den Button“ ist klarer, als in Design-Reviews einen Hex-Code zu nennen.
• CSS und Webdesign lernen: Studierende der Webentwicklung nutzen den Konverter, um zu erkunden, wie benannte CSS-Farben tatsächlichen Farbwerten entsprechen. Es ist ein Lernwerkzeug, das Anfängern hilft, den Zusammenhang zwischen Farbnamen und ihren numerischen Darstellungen zu verstehen.
• Erkunden von Farbthemen: Designer, die Farbthemen erkunden, nutzen den Konverter, um benannte CSS-Farben nach Familie durchzublättern. Suchen Sie alle Violetttöne, Blauschattierungen oder warmen Rottöne, um die perfekte benannte Farbe für ein Designsystem zu finden.
• CodePen und schnelle Prototypen: Frontend-Entwickler, die schnelle Prototypen oder CodePen-Demos bauen, nutzen den Konverter, um Farben zu finden, ohne den Browser zu verlassen. Benannte Farben sind in Inline-Styles und Demonstrationscode oft lesbarer als Hex-Codes.
• SVG- und Grafikprogrammierung: Grafikentwickler, die mit SVG, Canvas oder WebGL arbeiten, nutzen den Konverter, um die vollständige Palette der benannten CSS-Farben zu erreichen. Benannte Farben werden in SVG-Dateien und Grafik-APIs wegen ihrer Lesbarkeit und browserübergreifenden Konsistenz häufig verwendet.

Benannte CSS-Farben sind vordefinierte Farbschlüsselwörter, die alle modernen Webbrowser erkennen. Die Spezifikation CSS Color Level 4 definiert 148 benannte Farben , von gängigen Farben wie red und blue bis zu markanteren Namen wie rebeccapurple und cornflowerblue . Unser Konverter von benannten Farben zu HEX bietet sofortigen Zugriff auf alle 148 Farben mit Autovervollständigungssuche.

1. Farbnamen eintippen: Beginnen Sie, eine benannte CSS-Farbe zu tippen (z. B. „coral“, „rebecca“, „sky blue“). Die Autovervollständigung filtert sofort die vollständige Datenbank der 148 benannten CSS-Farben. Sie können nach dem CSS-Namen ( cornflowerblue ) oder dem Anzeigenamen ( Cornflower Blue ) suchen. Die gesamte Verarbeitung läuft lokal in Ihrem Browser.
2. Farbe wählen oder die Autovervollständigung arbeiten lassen: Klicken Sie auf einen Vorschlag aus der Liste oder tippen Sie weiter, bis nur noch eine Übereinstimmung übrig ist. Farbvorschau und alle Werte aktualisieren sich in Echtzeit während des Tippens. Das große Farbfeld zeigt die gewählte Farbe mit ihren Kanalleisten für Rot, Grün und Blau.
3. Jeden Wert sofort kopieren: Nutzen Sie die Schaltfläche Kopieren neben jeder Ausgabezeile (HEX, RGB, HSL), um genau diesen Wert zu kopieren, oder „Alle Werte kopieren“, um die vollständigen Farbdaten inklusive Farbname und Luminanz zu übernehmen.

• Rot und Rosa: 20 Farben von reinem Rot bis zu Rosatönen, darunter crimson , deeppink und hotpink .
• Orange und Gelb: 14 warme Farben von darkorange bis lightyellow , einschließlich der gold- und khaki-Familie.
• Grün und Cyan: 33 Farben über das gesamte Grünspektrum plus Cyan-/Türkistöne, von forestgreen bis turquoise .
• Blau und Violett: 35 kühle Farben vom tiefen midnightblue bis zum hellen lavender , darunter das ikonische rebeccapurple .
• Braun, Weiß, Grau und Schwarz: 46 neutrale und erdige Farben von saddlebrown und wheat bis zur vollständigen Graufamilie und reinem Schwarz .

Benannte CSS-Farben verbessern die Lesbarkeit des Codes gegenüber rohen Hex-Codes. background: cornflowerblue ist selbsterklärender als background: #6495ED . Benannte Farben sind auch in SVG-Dateien, Canvas-API-Aufrufen und überall dort nützlich, wo Farbnamen die Klarheit erhöhen. Für Produktions-Designsysteme bietet jedoch die Kombination aus CSS-Custom-Properties mit semantischer Benennung (wie --color-primary ) und benannten Farben sowohl Lesbarkeit als auch Flexibilität.

Unser Konverter von benannten Farben zu HEX schließt die Lücke zwischen Farbnamen und präzisen numerischen Werten. Ob Sie prototypen, CSS lernen oder eine benannte Farbe für ein Designsystem in ihr exaktes HEX- oder RGB-Äquivalent umwandeln möchten – dieses Tool liefert sofort präzise Ergebnisse ohne serverseitige Verarbeitung.