Files
ayathedesigner-analyse/02-farbpalette.md
T
2026-06-14 13:00:32 +02:00

94 lines
3.5 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# ayathedesigner Farbpalette & Farbanwendung
---
## Primäre Farbwelten
Aya arbeitet mit vier distinkten Farbwelten, die sie je nach Kundenprofil einsetzt:
---
### Welt 1: Dark Premium (Fintech / SaaS / App)
Die häufigste Ästhetik in ihren Posts. Basis ist immer ein sehr dunkler Hintergrund.
| Rolle | Farbe | Beschreibung |
|---|---|---|
| Hintergrund | `#0A0A0F` `#12102A` | Fast-Schwarz bis Tief-Dunkelblau |
| Primär-Akzent | `#6B4EFF` `#8B5CF6` | Violett / Electric Purple |
| Sekundär-Akzent | `#3B82F6` | Blau |
| Gradient-Akzent | Orange → Pink → Blau | Holographic / Neon-Gradient |
| Text hell | `#FFFFFF` | Reines Weiß für Headlines |
| Text gedimmt | `#9CA3AF` | Grau für Body-Text |
| CTA | `#7C3AED` oder weiß auf dunkel | Button-Farbe |
**Beispiele beobachtet:**
- Beyond Finance App: Dunkel-Violett (#1A0533) + Neon-Gradient (orange-pink-blau, holographisch)
- Proton Pass App: Reines Schwarz (#000000) + Weiß, keine Akzentfarbe außer Grau
- Task-Management-App: Dunkel-Blau (#0D1B3E) + helles Blau als Akzent
---
### Welt 2: Neon Contrast (Bold Finance)
Extrem hoher Kontrast durch eine einzige, fast schreiende Akzentfarbe auf fast-schwarzem Grund.
| Rolle | Farbe | Beschreibung |
|---|---|---|
| Hintergrund | `#0F0F0F` `#111111` | Tief-Schwarz |
| Neon-Akzent | `#CCFF00` `#D4FF00` | Neongrün / Acid Green |
| Text | `#FFFFFF` | Weiß |
| CTA-Button | `#CCFF00` mit schwarzem Text | Hoher Kontrast |
**Beispiel beobachtet:**
- Finance App "Find way to manage your finance": Schwarz + Acid Green für Balken, Karte, Button, Statistik-Highlights
---
### Welt 3: Warm / Organic (Marketing / Portfolio / Editorial)
Für Kunden, die Wärme und Vertrauen kommunizieren wollen.
| Rolle | Farbe | Beschreibung |
|---|---|---|
| Hintergrund | `#FAFAF8` `#FFF8F0` | Off-White / Creme |
| Warm-Akzent 1 | `#D4A853` `#F0C060` | Gold / Amber |
| Warm-Akzent 2 | `#E87040` `#F05020` | Orange-Rot (CTAs) |
| Pflanzen/Natur | `#4A7C59` | Grün für organische Elemente |
| Text dunkel | `#111111` `#1A1A1A` | Fast-Schwarz für Headlines |
| Text medium | `#6B7280` | Grau für Body |
**Beispiele beobachtet:**
- Rapeto (Growth Marketing): Gold-Beige Hintergrund, schwebende Karten
- Convix Software: Himmelsblau + Schmetterlinge + weiße UI-Elemente
- BrandLyft: Creme (#FFF5F0) + Orange-Rot CTA + handgezeichnete Annotierungen
---
### Welt 4: Editorial Monochrom (Agentur / High-End)
Reduziert auf Schwarz & Weiß, maximale Typografie-Dominanz.
| Rolle | Farbe |
|---|---|
| Hintergrund | `#FFFFFF` oder `#0A0A0A` |
| Text / Elemente | `#000000` oder `#FFFFFF` |
| Akzent | Maximal 1 Farbe, sehr sparsam |
**Beispiel beobachtet:**
- Ockham Agentur-Website: Schwarz-Weiß, editorial, PROJECTS grid
---
## Farbprinzipien
1. **Monochrome + 1 Akzent**: Fast alle Designs laufen auf einem neutralen Grund (schwarz, weiß, creme) mit exakt EINEM Akzentton. Nie mehr als zwei aktive Farben.
2. **Akzent = Funktion**: Die Akzentfarbe sitzt immer auf dem CTA-Button, dem wichtigsten Datenwert oder dem Headline-Highlight. Farbe als Wegweiser.
3. **Gradient = Premium**: Sobald ein Farbverlauf erscheint, ist er holographisch (mehrere Spektralfarben) das positioniert die Marke sofort im Premium-Segment.
4. **Hintergrundfarbe = Markencharakter**: Weiß = vertrauenswürdig/sauber, Schwarz = premium/tech, Gold = Wachstum/warm, Dunkel-Violett = mysteriös/fintech.
5. **Keine Pastellfarben**: Aya meidet pastellige, verwässerte Töne. Ihre Farben sind entweder sehr gesättigt/neon oder komplett entsättigt (grau, weiß, schwarz).