Die 21 besten dystopischen Farbpaletten mit Hex-Codes

Eine dystopische Farbpalette basiert auf Spannung: raue Neutraltöne, verschmutzte Pastellfarben und Alarmakzente, die industriell, kontrolliert und leicht beunruhigend wirken.

Nachfolgend finden Sie über 20 Ideen für dystopische Farbpaletten mit HEX-Codes – plus praktische Hinweise für UI, Poster, Branding und KI-Prompts, die Sie zur Erstellung passender Visuals wiederverwenden können.

Warum dystopische Paletten so gut funktionieren

Dystopische Farbschemata wirken glaubwürdig, weil sie echte Materialien und Lichtverhältnisse nachahmen: Beton, Nebel, oxidiertes Metall, Natrium-Straßenlampen und Bildschirmleuchten. Diese Realitätsnähe erdet Designs, auch wenn das Konzept futuristisch ist.

Sie schaffen auch sofortige Hierarchie. Tiefes Anthrazit und Blaugrautöne strukturieren, während ein einziger Warnakzent (Bernstein, toxisches Grün, Signalrot) Aufmerksamkeit lenkt, ohne dass zusätzliche Dekoration nötig ist.

Die meisten dystopische Paletten sind von Natur aus „markensicher“ für seriöse Produkte: kontrolliert, minimal und kontrastreich. Sie können sie mit nur einer Akzentfarbe in Richtung Cyberpunk, Militär oder Kino verschieben.

20+ Ideen für dystopische Farbkombinationen (mit HEX-Codes)

1) Aschfall-Beton

HEX: #1C1F24 #3A4048 #6B727C #B6B1A6 #D9D4C9

Stimmung: rau, kühl, minimalistisch

Am besten geeignet für: Brutalistische UI-Dashboards

Raue und stille Grautöne wie eine Stadt nach dem Verstummen der Sirenen, diese zementartigen und kreidigen Neutraltöne wirken kontrolliert und angespannt. Geeignet für Admin-Panels, datenintensive Dashboards und Systemoberflächen, bei denen Klarheit zählt. Kombinieren Sie den hellsten Ton mit viel Weißraum und reservieren Sie die dunkelste Nuance für Navigation und Überschriften. Tipp: Akzentfarbe nur für Icon-Zustände nutzen, damit die Oberfläche streng bleibt und nicht unruhig wird.

Bildbeispiel von Aschfall-Beton generiert mit media.io

Media.io

Media.io ist ein Online-KI-Studio zum Erstellen und Bearbeiten von Video, Bild und Audio in Ihrem Browser.

Jetzt kostenlos ausprobieren

2) Verrostetes Neon

HEX: #0F1114 #2B2F36 #A14E2D #D8893A #E6D2B8

Stimmung: industriell, dringlich, hitzeflimmernd

Am besten geeignet für: Tech-Produktanzeigen und Hero-Banner

Industriell und dringlich – wie oxidierter Stahl, beleuchtet von einem sterbenden Schild. Die Rost- und Bernsteintöne kommen am besten auf dunklem Graphithintergrund für Hero-Banner und Feature-Highlights zur Geltung. Das helle Sandbeige als Negativraum einsetzen, damit Typografie klar und hochwertig bleibt. Tipp: Verwenden Sie das leuchtende Bernstein nur für eine Primär-Schaltfläche, um ein Übermaß an Warnband-Ästhetik zu vermeiden.

Bildbeispiel von verrostetem Neon generiert mit media.io

3) Bunker-Khaki

HEX: #121513 #2D332F #5B5F45 #8F8A5D #C8C3A1

Stimmung: militärisch, gedämpft, bodenständig

Am besten geeignet für: Outdoor-Markenauftritt und Etiketten

Gedämpft und bodenständig, diese Bunkergrün-Töne erinnern an Leinwand, Staub und gebrauchte Feldausrüstung. Gut geeignet für Outdoor-Branding, funktionale Verpackung und Etiketten, bei denen Disziplin gefragt ist. Das helle Khaki mit schwarzer Typografie für maximale Lesbarkeit und einen sachlichen Look kombinieren. Tipp: Verwenden Sie den olivfarbenen Mittelton für sekundäre Abzeichen, damit die Hierarchie ruhig bleibt.

Bildbeispiel von Bunker-Khaki generiert mit media.io

4) Smog-Violett

HEX: #17131A #3A2E44 #6B5A7A #A69AA8 #E3DEE6

Stimmung: atmosphärisch, nachtaktiv, introspektiv

Am besten geeignet für: Albumcover und Editorial-Layouts

Stimmungsvoll und nachtaktiv wirken diese Violetttöne wie Straßenbeleuchtung im dichten Smog. Ideal für Albumkunst, lange Editorialartikel oder Plakattypografie, wo Atmosphäre genauso zählt wie Kontrast. Kombinieren Sie das zarte Lavendel mit einem tief tintenblauen Hintergrund, damit die Palette elegant und nicht gotisch wirkt. Tipp: Feines Korn im Hintergrund sorgt dafür, dass die Farbverläufe cineastischer erscheinen.

Bildbeispiel von Smog-Violett generiert mit media.io

5) Radioaktives Moos

HEX: #0B0E0C #1F2A1F #3C5A3A #7CC04B #D6F2B8

Stimmung: toxisch, lebendig, kontrastreich

Am besten geeignet für: Gaming-UI und Sci-Fi-Thumbnails

Toxisch und lebendig – erinnert an Moos, das unter Schwarzlicht in einem verlassenen Tunnel glüht. Dieses Set ist für Gaming-Oberflächen, Sci-Fi-Thumbnails und Statusanzeigen gemacht, bei denen Grün sofort erkennbar sein muss. Das Neonmoos als Akzent, nicht als Hintergrund einsetzen, die dunkleren Grüntöne für Flächen nutzen. Tipp: Das zarte Mintgrün nur für kleine Texte und Iconkonturen verwenden, um Ausbleichung zu vermeiden.

Bildbeispiel von radioaktivem Moos generiert mit media.io

6) Überwachungsschiefer

HEX: #0E141B #1F2C3A #2F4A5A #8AA0AE #E8EEF2

Stimmung: klinisch, wachsam, technisch

Am besten geeignet für: Security-SaaS-UI und Berichte

Klinisch und wachsam erinnern diese Blau-Grautöne an CCTV-Leuchten und Serverraumlicht. Geeignet für Security-Dashboards, Prüfberichte und Enterprise-SaaS, wo Vertrauen und Zurückhaltung entscheidend sind. Das eisige Offwhite mit großzügigen Abständen kombinieren, um ein beengtes Überwachungswand-Gefühl zu vermeiden. Tipp: Mittel-Schiefer für Tabellenzeilen, den dunkelsten Ton für Seitenleisten nutzen, damit das Scannen schnell bleibt.

Bildbeispiel von Überwachungsschiefer generiert mit media.io

7) Ausgangssperre

HEX: #050608 #141621 #2B2E3E #5E6176 #C9CBD6

Stimmung: ruhig, angespannt, nächtlich

Am besten geeignet für: Filmposter und Titelkarten

Ruhig und angespannt, diese Mitternachtsblautöne erinnern an leere Straßen unter Ausgangssperre. Das Spektrum ist ideal für Titelkarten, Filmposter und Dark-Mode-Layouts, die Tiefe jenseits von Schwarz brauchen. Das blasse Grau mit schmaler Schrift kombinieren, um den cineastischen Charakter hervorzuheben. Tipp: Nutzen Sie eine weiche Vignettierung mit dem Mittelton, um den Fokus zur Überschrift zu lenken.

Bildbeispiel von Ausgangssperre generiert mit media.io

8) Defekte Beschilderung

HEX: #111315 #3E3B37 #B7A99A #E0C34E #F3EFE6

Stimmung: verwittert, warnend, urban

Am besten geeignet für: Veranstaltungsflyer und rau wirkende Poster

Verwittert und warnend erinnert es an verblasste Werbetafeln und rissige Straßenmarkierungen. Diese Töne erzeugen starke Farbkombis für Flyer, Protestplakate und Editorials im Grunge-Stil. Das Warn-Gelb mit groben Strukturen oder Rastermustern kombinieren – aber nur in kleinen Blöcken und Unterstreichungen verwenden. Tipp: Warmes Offwhite für Lesbarkeit wählen, vor allem mit distressed Schrift-Effekten.

Bildbeispiel von defekter Beschilderung generiert mit media.io

9) Kalte Pipeline

HEX: #0B0F12 #1C272E #3B4B4F #7A8C8A #D5DFDD

Stimmung: mechanisch, kühl, funktional

Am besten geeignet für: Infografiken und technische Dokumente

Mechanisch und kühl erinnern diese blau-grünen Grautöne an Rohre, Ventile und beschlagenen Stahl. Sie sind zuverlässig für technische Dokumentation, Infografiken und Systemdiagramme, wo ein ruhiger Kontrast gebraucht wird. Kombinieren Sie den hellen Nebelton mit klaren Linien-Icons und lassen Sie die dunkleren Nuancen die Struktur definieren. Tipp: Begrenzen Sie Diagramme auf zwei dominante Farbtöne, damit die Daten vor der Stimmung erkennbar bleiben.

Beispielbild einer kalten Rohrleitung, generiert mit media.io

10) Wasteland Sunrise

HEX: #241C1A #5A3B2E #A96A4A #D0A27A #F1E6D6

Stimmung: staubig, hoffnungsvoll, filmisch

Am besten geeignet für: Buchcover und cineastische Key-Artworks

Staubig, aber hoffnungsvoll, wirkt es wie ein Sonnenaufgang, der Sand und Rauch durchschneidet. Diese Palette eignet sich für Buchcover, cineastische Key-Artworks und Landingpages, die Wärme brauchen, ohne fröhlich zu wirken. Kombinieren Sie das tiefe Umbra mit großzügigen Rändern und verwenden Sie die Pfirsich-Sand-Töne für große Farbverläufe. Tipp: Fügen Sie einen einzelnen harten Schatten im dunkelsten Farbton hinzu, um Kompositionen sonnendurchglüht und real erscheinen zu lassen.

Beispielbild eines Wasteland-Sonnenaufgangs, generiert mit media.io

11) Reactor Core

HEX: #0A0C10 #1B2330 #2E3D57 #F05A3A #F2E7D8

Stimmung: geladen, gefährlich, high-tech

Am besten geeignet für: Startup-Branding und Call-to-Action-Bereiche

Geladen und gefährlich, erinnert es an heißes Metall in einer kalten Maschine. Der Kontrast zwischen Stahlblau und erhitztem Orange schafft dystopische Farbkombinationen, die sich für Startup-Branding und CTA-lastige Seiten hervorragend eignen. Kombinieren Sie das Orange mit hellem Creme für Buttons und Badges, und halten Sie Hintergründe in tiefem Blau, um das Drama zu bewahren. Tipp: Verwenden Sie Orange nicht für Fließtext; reservieren Sie es für Interaktionszustände und Highlights.

Beispielbild eines Reactor Core, generiert mit media.io

12) Static Fog

HEX: #0D0E10 #2A2B2E #5B5D62 #A8ABB2 #F4F5F7

Stimmung: düster, modern, luftig

Am besten geeignet für: minimalistische Websites und Typografiesysteme

Düster und modern wirken diese Grautöne wie statisches Rauschen auf einem nebligen Bildschirm. Sie passen zu minimalistischen Websites, Typografiesystemen und Portfolios, die Dramatik ohne Farbe wollen. Kombinieren Sie das Fast-Schwarz mit Fast-Weiß für klare Schrift und verwenden Sie das mittlere Grau, um Trennelemente abzumildern. Tipp: Fügen Sie Mikro-Kontrast durch eine leichte Tönung bei Karten mit dem hellen Grau hinzu, um eine "platte" Anmutung zu vermeiden.

Beispielbild von Static Fog, generiert mit media.io

13) Quarry Dust

HEX: #15110E #3A3028 #6D6258 #A79E93 #E7E1D7

Stimmung: erdig, abgenutzt, zurückhaltend

Am besten geeignet für: Handwerksproduktverpackungen und Kataloge

Erdig und abgenutzt erinnert es an zerschlagenen Stein, trockene Erde und verwittertes Leder. Diese Töne eignen sich bestens für handwerkliche Verpackungen, Kataloge und Markensysteme, die Struktur ohne kräftige Farben brauchen. Kombinieren Sie den hellsten Farbton mit viel Raum zum Atmen und nutzen Sie das dunkelste Braun für Logos. Tipp: Eine subtile Papierstruktur lässt die Neutraltöne beabsichtigt wirken – und nicht langweilig.

Beispielbild von Quarry Dust, generiert mit media.io

14) Acid Raincoat

HEX: #0E1012 #2C3136 #55606A #C7D24A #E7EBD0

Stimmung: nass, urban, signalhell

Am besten geeignet für: Streetwear-Drops und Lookbooks

Nass und urban wirkt es wie Asphaltspiegelungen unter einem Neonregenmantel. Nutzen Sie diese Töne für Streetwear-Lookbooks, Drop-Ankündigungen und mutige typografische Layouts. Kombinieren Sie das saure Gelbgrün mit Anthrazit für kräftigen Kontrast und behalten Sie den blassen Farbton für Freiraum. Tipp: Das Akzentgrün wird als wiederholendes Mikro-Detail (wie eine Tagline oder Größenlabel) eingesetzt, nicht als kompletten Hintergrund.

Beispielbild von Acid Raincoat, generiert mit media.io

15) Riot Siren

HEX: #120B0C #3A1C20 #7A2E34 #D23B3B #F2D7D7

Stimmung: aggressiv, dringend, dramatisch

Am besten geeignet für: Kampagnen-Grafiken und auffällige Überschriften

Aggressiv und dringend – wie Sirenenlicht, das dunklen Rauch durchdringt. Diese Kombination ist ideal für Kampagnen-Grafiken, kräftige Schlagzeilen und Ankündigungsbanner, die auf sich aufmerksam machen müssen. Kombinieren Sie das heiße Rot mit tiefem Maroon für Tiefe und verwenden Sie das helle Rosé nur als Kontrastfläche hinter Text. Tipp: Halten Sie Farbverläufe minimal, damit das Rot scharf und autoritativ bleibt.

Beispielbild von Riot Siren, generiert mit media.io

16) Blackout Terminal

HEX: #000000 #0E1A14 #1F3B2C #4F8A63 #CFEBD9

Stimmung: Hacker, codiert, nachtaktiv

Am besten geeignet für: Terminal-UI und Entwicklertools

Hacker-entspannt und nachtaktiv transportiert es das Gefühl eines leuchtenden Terminals in einem dunklen Raum. Diese Grüntöne ergeben eine überzeugende dystopische Farbkombination für Entwicklertools, Terminal-UIs und Login-Seiten. Nutzen Sie das Minzgrün als Highlight mit reinem Schwarz für klaren, codeähnlichen Kontrast und setzen Sie mittlere Grüntöne für Flächen ein. Tipp: Das hellste Grün nur für aktive Cursors, Erfolgs-States und Kurzinfos verwenden.

Beispielbild von Blackout Terminal, generiert mit media.io

17) Urban Decay Teal

HEX: #0C1011 #1E2A2C #2F4E4C #5FA39A #D9F1ED

Stimmung: korrodiert, kühl, atmosphärisch

Am besten geeignet für: Musikvisuals und Social-Posts

Korrodiert und kühl: Diese Teal-Töne erinnern an oxidiertes Metall und feuchten Beton. Sie passen zu Musikvisuals, Social-Posts und Motion-Hintergründen, wo Stimmung gewünscht ist, aber keine große Dunkelheit. Kombinieren Sie den Meerglas-Ton mit Anthrazit für Text und nutzen Sie das blasse Aqua für sanfte Lichteffekte. Tipp: Fügen Sie subtile Unschärfe oder Glow hinzu, damit das Teal wie reflektiertes Licht und nicht wie flache Farbe wirkt.

Beispielbild von Urban Decay Teal, generiert mit media.io

18) Desaturated Carnival

HEX: #1A1A1E #3E3B46 #7C6A72 #B09A87 #E7DFD6

Stimmung: unheimlich, nostalgisch, verblichen

Am besten geeignet für: Editorial-Collagen und Zines

Unheimlich und nostalgisch – erinnert es an verblichene Farbe auf alten Fahrgeschäften nach langer Schließung. Die entsättigten Mauves und das staubige Beige eignen sich für Zines, Editorial-Collagen und Kunstdrucke. Kombinieren Sie das warme Beige mit tiefem Anthrazit, um Layouts lesbar zu halten, und nutzen Sie die Mauve-Töne für ausgeschnittene Formen und Bildunterschriften. Tipp: Ein leicht unsauberer Druckeffekt macht die Palette gezielt verstörend.

Beispielbild von Desaturated Carnival, generiert mit media.io

19) Muted Warning Tape

HEX: #0F0F10 #2A2A2B #666154 #C2B65A #F0EEDC

Stimmung: warnend, staubig, funktional

Am besten geeignet für: UX-Warnhinweise und Systemstatus-Screens

Warnend und staubig sieht aus wie Warnband, das Sonne und Staub ausgesetzt war. Diese Farben eignen sich perfekt für UX-Warnungen, Systemstatus-Bildschirme und Onboarding-Hinweise, wo Aufmerksamkeit gefragt ist, aber kein Neon. Kombinieren Sie das gedämpfte Gelb mit Anthrazit für Icons und behalten Sie den Creme-Ton für Nachrichtenfelder. Tipp: Verwenden Sie das Gelb strikt nur für Warnungen, damit Ihre Hierarchie zuverlässig bleibt.

Beispielbild von Muted Warning Tape, generiert mit media.io

20) Exile Coast

HEX: #0B1416 #193038 #2F5B63 #8DA7A5 #E3ECEA

Stimmung: windig, fern, melancholisch

Am besten geeignet für: Reise-Editorials und Bildüberlagerungen

Windig und fern ruft es kalte Gischt und leere Docks im Morgengrauen hervor. Es eignet sich für Reise-Editorials, Bildüberlagerungen und Web-Abschnitte, die eine ruhige, unruhige Atmosphäre brauchen. Kombinieren Sie das tiefe Teal mit hellen Nebeltönen für gut lesbare Overlays und lassen Sie das blau-graue Mittelgrau UI-Komponenten gestalten. Tipp: Falls Sie Bilder verwenden, halten Sie Fotos entsättigt, sodass die Palette im Vordergrund bleibt.

Beispielbild von Exile Coast, generiert mit media.io

21) Cinder Blossom

HEX: #141012 #3B2A2F #6E4A55 #B07B7C #EFE1DF

Stimmung: romantischer Verfall, weich, rauchig

Am besten geeignet für: Beauty-Branding und Verpackungen

Romantischer Verfall und rauchige Weichheit treffen sich in diesen staubigen Rosen-Brauntönen. Sie passen zu Beauty-Branding, Parfumverpackungen und Boutique-Landingpages, die Wärme mit Kante suchen. Kombinieren Sie die Blushtöne mit tiefem Pflaumenbraun für Logos und Überschriften und behalten Sie den hellen Ton für saubere Produktflächen. Tipp: Satin-Finishes oder sanfte Farbverläufe lassen die Mauvetöne luxuriös und nicht flach wirken.

Beispielbild von Cinder Blossom, generiert mit media.io

Welche Farben passen zu Dystopisch?

Dystopische Paletten funktionieren am besten mit zurückhaltenden Neutraltönen: Anthrazit, Graphit, Betongrau, staubiges Beige und Off-White. Diese Töne wirken materiell und funktionell und sorgen für einen glaubwürdigen Look.

Für Akzente wählen Sie „Signal“-Farben, die als Warnung oder Systemstatus gelesen werden—Bernstein, giftiges Gelbgrün, heißes Orange, Sirenenrot oder eisiges Cyan—und setzen Sie diese sparsam ein, um die Stimmung angespannt statt verspielt zu halten.

Entsättigte Violett-, Teal- und Blau-Grautöne sind ideale Brückenfarben. Sie geben Atmosphäre (Nacht, Nebel, Überwachungsglanz) und erhalten die Lesbarkeit in UI und Editorial-Layouts.

Wie man eine dystopische Farbpalette in echten Designs nutzt

Beginnen Sie mit einer dunklen Basis (Fast-Schwarz, Navy-Schiefer oder tiefes Grün) und bauen Sie Flächen mit zwei Mitteltönen auf. Reservieren Sie dann den hellsten Ton für Schriftflächen, Karten und Abstände, damit Ihr Design nicht zu einer einzigen dunklen Masse zusammenfällt.

Setzen Sie Akzente gezielt ein. Verwenden Sie eine Highlight-Farbe für Primäraktionen oder Warnungen und eine zweite (optional) für sekundäre Zustände wie Hover, Ausgewählt oder Fortschritt – mehr kann als Cyberpunk-Lärm statt dystopischer Zurückhaltung wirken.

Texturen unterstützen die Atmosphäre. Subtiles Korn, Papierfasern, Rasterverschleiß oder sanfte Vignetten lassen neutrale Kombinationen filmisch und „erlebt“ wirken – ohne Klarheit einzubüßen.

Erstellen Sie dystopische Paletten-Visuals mit KI

Wenn Sie passende Visuals benötigen (Poster, UI-Mockups, Verpackungsfotos oder Social-Kreatives), generieren Sie sie aus Text-Prompts und sperren Sie den Look mit Ihren HEX-Farben und Lichtstimmungen (Nebel, Neon, hartes Seitenlicht oder CRT-Glow).

Nutzen Sie die Prompts unter jeder Palette und tauschen Sie dabei das Motiv aus (Dashboard → Landingpage, Flyer → Albumcover), behalten Sie aber die Farbbegriffe und Stimmungsbeschreibungen bei, damit die Serie konsistent bleibt.

Media.io macht es einfach, dystopische Bilder im Browser zu erstellen – und das Farbschema mit schnellen Anpassungen über alle Medien hinweg konsistent zu halten.

Weiter: Duke-Blau-Farbpalette