standby.design
Multi-Tool-Hub unter standby.design — kleine Tools für Designer und Entwickler. Kein Framework, kein Build-Step, reines HTML/CSS/JS.
MCP-Server für KI-Agenten: https://standby.design/docs/mcp
Struktur
/
├── index.html # Hub-Seite (standby.design)
├── color/
│ └── index.html # Color Palette Generator (standby.design/color)
├── Dockerfile
├── nginx.conf
├── docker-compose.yml
└── deploy.sh
Deployment (Hetzner + Docker + nginx)
./deploy.sh
Setzt voraus: SSH-Key unter C:/Local Data/Repositories/SSH Keys/hetzner_ed25519.
DNS (Namecheap)
A-Record für standby.design und www.standby.design → 46.225.131.97
Color Palette Generator (/color)
Ein interaktiver, client-seitiger Palette-Generator im OKLCH-Farbraum — keine Dependencies, kein Build-Step.
Features
- Brand + Slated: Generiert automatisch eine volle Palette (Brand) und eine gedämpfte Variante mit 50% Chroma (Slated)
- 18 Abstufungen: Feine Gradierung für Light Surfaces (25–100), Core Palette (200–800), Dark Surfaces (825–875) und High Contrast (925–975)
- Zwei Modi:
- Balanced Midpoint — 500 = perzeptueller Mittelwert (L=0.50), symmetrisch um den hellsten Punkt des Farbtons
- Exact Brand Match — 500 = exakt die Eingabefarbe, Helligkeit + Chroma werden gleichmäßig darum herum skaliert
- Click-to-Copy: Einzelne Hex- und OKLCH-Werte per Klick kopieren
- Code-Export: Fertige CSS Custom Properties (OKLCH + Hex Fallback) zum Kopieren
- Surface-Demo: Live-Vorschau für Light Mode, Dark Mode und High Contrast Surfaces
- Grau-sicher: Neutrale Eingaben (z.B.
#757575) erzeugen saubere Grau-Paletten ohne Farbstich
Verwendung
index.htmlim Browser öffnen- Hex-Farbcode eingeben (mit oder ohne
#) - Modus wählen (Balanced Midpoint / Exact Brand Match)
- Palette generieren — fertig
Zonenstruktur
Technologie
- Reines HTML + CSS + JavaScript (zero dependencies)
- OKLCH ↔ OKLab ↔ Linear sRGB ↔ sRGB Konvertierung
- Binäre Suche für sRGB-Gamut-Clamping
- Parabolische Chroma-Envelope für natürliche Sättigungsverteilung