Hierarchie-Ramps fuer Internal Mode

4-Tier Farbabstufungen fuer Container-Nesting in Architektur-Diagrammen.

---

Verfuegbare Ramps

Slate

slate-1

slate-2

slate-3

slate-4

Sand

sand-1

sand-2

sand-3

sand-4

Lavender ★

lavender-1

lavender-2

lavender-3

lavender-4

Teal

teal-1

teal-2

teal-3

teal-4

Turquoise

turquoise-1

turquoise-2

turquoise-3

turquoise-4

Fandango ★

fandango-1

fandango-2

fandango-3

fandango-4

★ Funktioniert auf allen System-Hintergruenden

---

Kombinationen mit System-Hintergrund (Start bei Tier-1)

TOGETHERStart bei Tier-1

Slate (1.14)

slate-1

slate-2

slate-3

slate-4

Lavender (1.15) ★

lavender-1

lavender-2

lavender-3

lavender-4

Teal (1.14)

teal-1

teal-2

teal-3

teal-4

Sand (1.21)

sand-1

sand-2

sand-3

sand-4

Aehnliche Waerme

Turquoise (1.12)

turquoise-1

turquoise-2

turquoise-3

turquoise-4

Fandango (1.13) ★

fandango-1

fandango-2

fandango-3

fandango-4

CCAStart bei Tier-1

Sand (1.14)

sand-1

sand-2

sand-3

sand-4

Lavender (1.09) ★

lavender-1

lavender-2

lavender-3

lavender-4

Fandango (1.07) ★

fandango-1

fandango-2

fandango-3

fandango-4

Teal (1.07)

teal-1

teal-2

teal-3

teal-4

Turquoise (1.06)

turquoise-1

turquoise-2

turquoise-3

turquoise-4

Aehnliches Blau

Slate (1.08)

slate-1

slate-2

slate-3

slate-4

Aehnliches Grau-Blau

---

Mit Tier-2 als Startpunkt (empfohlen)

Bei System-Hintergrund mit Tier-2 starten fuer besseren Kontrast (+20-40%).

TOGETHERStart bei Tier-2

Slate (1.38)

slate-3

slate-4

slate-5

Lavender (1.60) ★

lavender-3

lavender-4

lavender-5

Teal (1.40)

teal-3

teal-4

teal-5

Sand (1.59)

sand-3

sand-4

sand-5

Aehnliche Waerme

Turquoise (1.39)

turquoise-3

turquoise-4

turquoise-5

Fandango (1.50) ★

fandango-3

fandango-4

fandango-5

CCAStart bei Tier-2

Sand (1.50)

sand-3

sand-4

sand-5

Lavender (1.50) ★

lavender-3

lavender-4

lavender-5

Fandango (1.42) ★

fandango-3

fandango-4

fandango-5

Teal (1.32)

teal-3

teal-4

teal-5

Turquoise (1.31)

turquoise-3

turquoise-4

turquoise-5

Aehnliches Blau

Slate (1.30)

slate-3

slate-4

slate-5

Aehnliches Grau-Blau

---

Empfehlungen

System-Hintergrund	Empfohlene Ramps	Vermeiden
together-light	Slate, Lavender, Teal, Turquoise, Fandango	Sand (aehnliche Waerme)
cca-light	Sand, Lavender, Fandango	Turquoise, Slate (aehnliches Blau)
Neutral / Theme	Alle Ramps	-

Farbtemperatur statt Kontrast

Die Empfehlungen basieren auf Farbtemperatur-Unterschieden, nicht WCAG-Luminanz-Kontrast:

• Warme Ramps (Sand) vermeiden auf warmem Hintergrund (TOGETHER)
• Kalte Ramps (Turquoise, Slate) vermeiden auf kaltem Hintergrund (CCA)

---

Verwendung in D2

# Import
...@_colors-internal.d2

# Hierarchie mit Lavender-Ramp
outer: {
  style.fill: ${lavender-1}

  middle: {
    style.fill: ${lavender-2}

    inner: {
      style.fill: ${lavender-3}

      leaf: {
        style.fill: ${lavender-4}
      }
    }
  }
}

---

Dateien

Datei	Verwendung
_colors-internal.d2	Internal Mode - Hierarchie-Ramps + optionale System-Farben
_colors-context.d2	Context Mode - System-Farben mit Alt-Varianten
_colors-analysis.d2	Analysis Mode - Status-Farben + System-Alt bei Konflikt