Auros
Abyssales Terminal mit biolumineszenten Datenkugeln
Auros fungiert als Fintech-Terminal, das in der Tiefe zu schweben scheint: Eine fast schwarze, türkisfarbene Leinwand mit biolumineszenten Datenkugeln und sanften Farbverläufen von Türkis zu Rosa erzeugt ein Gefühl von Tiefe, Fluidität und Dynamik. Die Benutzeroberfläche ist minimalistisch und filmisch gestaltet und basiert auf einem einzelnen, mittelstarken Display (Matter) mit aggressivem Negativ-Tracking, das für eine realistische Darstellung sorgt, ohne dabei aufdringlich zu wirken. Die Farben sind gleichmäßig verteilt – achromatische Weiß- und Silbertöne dominieren fast alle Inhalte, während die Farbpalette für atmosphärische Farbverläufe, die Unterscheidung von Kartenoberflächen und einen charakteristischen, pillenförmigen Button reserviert ist, der seine Farbe von Türkisblau zu Lavendelrosa ändert. Die Karten schweben auf dezenten, türkisfarbenen Oberflächenerhebungen (16px Radius, keine Schatten) anstatt auf der Höhe, sodass die Hierarchie eher wie die Tiefe des Wassers als wie ein Schatten auf Papier wahrgenommen wird. Die Komponenten wirken durchdacht und instrumentenähnlich: Tracking-Markierungen in Großbuchstaben, schlanke geometrische Pfeilsymbole und große, hellrosa Zahlenanzeigen.
Ein dunkles, vollflächiges Canvas mit Inhalten bis maximal 1440 Pixel Breite. Das Hauptelement ist ein zentrierter Textblock (Haupttext → Überschrift → Untertext → Handlungsaufforderung), der die gesamte Höhe des Viewports einnimmt und im Hintergrund ein Partikel darstellt. Die Abschnitte sind als vollflächige Streifen mit großzügigen vertikalen Abständen von mindestens 68 Pixeln angeordnet und wechseln zwischen Canvas und leicht vertieften Flächen. Der Abschnitt „Entdecken“ verwendet ein asymmetrisches zweispaltiges Layout: Die linke Spalte enthält gestapelte Feature-Karten, während die rechte Spalte eine geometrische Molekülillustration zeigt. Die Inhalte sind in schmalen Spalten (maximal ca. 600 Pixel) zentriert, um eine gute Lesbarkeit zu gewährleisten, anstatt sich über die gesamte Breite zu erstrecken. Die Fußzeile ist eine vertiefte Vertiefung (#011d1c) mit einem vertikalen Rand von 120 Pixeln, die den Eindruck eines tiefen Beckens erweckt. Die Navigation ist ein schmales, transparentes Panel mit Elementen im Abstand von 16–24 Pixeln. Der Gesamtrhythmus ist filmisch und weitläufig – jeder Abschnitt atmet, und die tiefe, wasserähnliche Farbgebung erzeugt das Gefühl, mit jedem Abschnitt tiefer zu fallen.
Der visuelle Stil ist minimalistisch und atmosphärisch. Die Startseite präsentiert eine dreidimensionale Partikelkugel – Tausende winziger türkisblauer und weißer Punkte bilden eine rotierende Kugel, deren Form an die Leinwand und die lavendelrosa Akzente an den Rändern erinnert und so einen biolumineszenten Effekt erzeugt, der an ein Informationsobjekt denken lässt. Flache geometrische Moleküldiagramme (weiße Kreise und dünne Verbindungslinien auf dunklem Grund) dienen als dekorative Elemente in der rechten Spalte. Keine Fotos, keine Lifestyle-Bilder, keine Personen – die Bildsprache basiert auf klaren Datengrafiken und abstrakten Formen. Die Partikelkugel ist das prägende visuelle Element der Markenidentität; sie muss auf jeder wichtigen Seite mindestens einmal erscheinen, um die Tiefsee-Metapher zu verstärken.
Palette
Marke
- Liquid Abyss
#012624— Der Haupthintergrund besteht aus der Basis der Seite, dem Header, dem Hauptelement und dem dominanten dunkeltürkisen Feld. Er erzeugt eine Tiefsee-Atmosphäre. - Liquid Deep
#011d1c— Die vertiefte Oberfläche bildet den Hintergrund der Fußleiste und die tieferen Kartonplatten. Sie erscheint einen Halbton dunkler als die Leinwand und erzeugt so einen subtilen Tiefenverlauf nach unten. - Liquid Kelp
#003734— Erhöhte Kartenoberfläche und Schaltflächenfüllung – eine erhöhte Oberfläche, die eine Stufe über dem Abgrund positioniert ist. Wird für Feature-Karten, Inhaltsbereiche und den Startpunkt einer Farbverlaufsschaltfläche verwendet.
Neutral
- Liquid Mist
#edfffe— Ein kühler Weißton hebt den Fließtext, die Abschnittsüberschriften und die warme, helle Typografie hervor. Ein dezenter Blaustich verbindet den Fließtext mit dem türkisfarbenen Farbschema. - Platinum
#ffffff— Reinweiß wird für Überschriften, Navigationselemente, Symbolumrisse und kontrastreichen Text verwendet. Es ist die primäre Textfarbe in allen Überschriftenebenen und der primären Navigation. - Silver Mist
#bbc7c6— Sekundärtext, dezente Beschreibungen und Linkfarben sind im Originalzustand. Sie weisen einen leichten Grünstich auf, der den türkisfarbenen Hintergrund ergänzt. - Ash
#f2f2f2— Zusätzlicher Text für Zitate und Rezensionen. Ein neutraler, kühler Grauton, falls der türkisfarbene Unterton von Silver Mist zu grell wirkt. - Slate Deep
#707777— Eine dezente Oberflächentönung für inaktive oder schlecht sichtbare Hintergründe. Sie liegt zwischen Leinwand und Karton und erzeugt einen sehr subtilen Höhenunterschied. - Lavender Phosphor
#fde9ff— Die Hintergrundbeleuchtung hebt große Statistiken, Zählerstände und wichtige Kennzahlen hervor. Der Rosaton im charakteristischen Farbverlauf wird sparsam als leuchtender Akzent auf dunklen Oberflächen eingesetzt.
Typografie
von 10 bis 96 Pixel · 6 Schritte
- Matter — Ersatz: Inter · Umrisse 400, 500 · Die primäre Schriftart für Überschriften und Fließtext hat eine Stärke von 500 für alle Überschriften (H1–H3) und große dynamische Texte (86–295 px). Für Fließtext und UI-Texte kommt eine Stärke von 400 zum Einsatz. Sie zeichnet sich durch einen ausgeprägten negativen Buchstabenabstand bei großen Schriftgrößen aus (-0,04em bei 61 px, -0,046em bei 86 px) und einen großzügigen positiven Buchstabenabstand in den Titelbuchstaben (0,08em bei 20 px, 0,12em bei 12 px, 0,15em bei 10 px). Die Strategie, ausschließlich eine mittlere Stärke für Überschriften zu verwenden – keine Fett- oder Light-Schrift – verleiht der Schriftart eine einheitliche, professionelle Wirkung.
- Arial — Ersatz: system-ui · Umrisse 400 · Ein sekundärer Fallback für interaktive UI-Elemente (Navigation, Schaltflächen, Kopfzeilentext, Fußzeile). Wird nur bei einer Breite von 14 Pixeln angezeigt – dient als sicherer, universeller Fallback, wenn Matter nicht geladen ist, und umfasst Formularbeschriftungen, Schaltflächentexte und kurze Hilfetexte.
Intervalle und Form
| Zweck | Bedeutung |
|---|---|
| Dichte | Durchschnitt |
| Grundlegender Schritt | 20px |
| Radius der Schaltfläche | 6px |
| Kartenradius | 16px |
| Schatten | Nein – Ränder statt Schatten |
| Zwischen den Abschnitten | 68px |
| Seitenbreite | 1440px |
KI erstellt Ihre Website im Auros -Stil und füllt sie aus.
- Teile deine Produkte und Beiträge über den Link – Instagram, TikTok, Facebook.
- Übertragen Sie Inhalte von Ihrer alten Website – geben Sie einfach die Adresse an.
- Modernes Design auf der besten Plattform: React ( Next.js) mit serverseitigem Rendering und SEO-Optimierung direkt nach der Installation.
- Vollautomatisierte SEO-Optimierung für Suchergebnisse und Empfehlungen durch neuronale Netze.
Ähnliche Stile
- Linearity — Eine leuchtende Studiokonsole. Erstellen Sie Bildschirme mit minimalistischen schwarzen Arbeitsbereichen, die sich durch eine klare weiße Benutzeroberfläche, Chromakzente und gelegentliche Farbtupfer in leuchtendem Orange auszeichnen.
- Design Full-Time — ein Studiokino mit einem warmen Scheinwerfer
- Graphite — Leuchtendes Endraster. Erzeugen Sie dunkle, umrandete Produktflächen um präzise weiße typografische Markierungen und gelegentliche Lichtblitze.
- Featurebase — Eine violett beleuchtete Konsole. Stellen Sie sich jede Seite als dunkle, ruhige Bühne vor, aus deren unterem Rand ein leuchtender Arbeitsbereich für das Produkt hervortritt.
- BAM Photographers — Eine Galerieprojektion nach Mitternacht. Die schwarze Leinwand, die vergrößerten weißen Buchstaben und die filmischen Bildpaare erwecken den Eindruck, dass die Website eher ein Projektionsportfolio als ein typisches redaktionelles Raster ist.
- Nuxt — Terminalleuchten im Weltraum. Erzeugen Sie dunkle, geschlossene Schnittstellenebenen, auf denen Grün als Stromsignal vor blauschwarzen Oberflächen erscheint.
- AZAK — Ein Expeditionsfahrzeug in der Abenddämmerung. Die Seitenfolge besteht aus prägnanten technischen Beschreibungen: einem schwarzen Feld, einem hellen Blatt mit technischen Spezifikationen und anschließend einer visualisierten Darstellung des Antriebssystems.
- Air — Skulptur „Mitternachtshimmel durch Glas“
- Slash — Mitternachtsgewölbe mit vergoldeten Büchern
- Raycast — Mitternachts-Kommandozentrale, Korallen-Neon
- Dimension — Ein dämmerungsbeleuchteter Arbeitsplatz mit Milchglaswänden
- Modal — Ein phosphoreszierendes Terminal in einem abgedunkelten Serverraum – die einzige Lichtquelle ist ein helles Grün.