Farben

Angaben im Contao-Backend für CSS-ID immer ohne vorhergehende Raute #id und CSS-Klassen ohne vorhergehenden Punkt .klasse vornehmen. Mehrere Klassen sind durch ein Leerzeichen zu trennen.

Textfarben

Farbe CSS-Klasse Beispiel Webfarbe RGB-Farbraum
Weiß .color-white Textfarbe #ffffff R: 255 G: 255 B: 255
Hellgrau .color-light Textfarbe #e9ecef R: 233 G: 236 B: 239
Dunkelgrau .color-dark Textfarbe #343a40 R: 52 G: 58 B: 64
Schwarz .color-black Textfarbe #000000 R: 0 G: 0 B: 0
Erfolg (Grün) .color-success Textfarbe #28a745 R: 40 G: 167 B: 69
Info (Türkis) .color-info Textfarbe #17a2b8 R: 23 G: 162 B: 184
Warnung (Orange) .color-warning Textfarbe #ffc107 R: 255 G: 193 B: 7
Achtung (Rot) .color-danger Textfarbe #dc3545 R: 220 G: 53 B: 69
Primär (Blau) .color-primary Textfarbe #007bff R: 0 G: 123 B: 255
Sekundär (Grau) .color-secondary Textfarbe #6c757d R: 108 G: 117 B: 125

Hintergrundfarben

Farbe CSS-Klasse Beispiel Webfarbe RGB-Farbraum
Weiß .bg-white   Hintergrundfarbe   #ffffff R: 255 G: 255 B: 255
Hellgrau .bg-light   Hintergrundfarbe   #e9ecef R: 233 G: 236 B: 239
Dunkelgrau .bg-dark   Hintergrundfarbe   #343a40 R: 52 G: 58 B: 64
Schwarz .bg-black   Hintergrundfarbe   #000000 R: 0 G: 0 B: 0
Erfolg (Grün) .bg-success   Hintergrundfarbe   #28a745 R: 40 G: 167 B: 69
Info (Türkis) .bg-info   Hintergrundfarbe   #17a2b8 R: 23 G: 162 B: 184
Warnung (Orange) .bg-warning   Hintergrundfarbe   #ffc107 R: 255 G: 193 B: 7
Achtung (Rot) .bg-danger   Hintergrundfarbe   #dc3545 R: 220 G: 53 B: 69
Primär (Blau) .bg-primary   Hintergrundfarbe   #007bff R: 0 G: 123 B: 255
Sekundär (Grau) .bg-secondary   Hintergrundfarbe   #6c757d R: 108 G: 117 B: 125

Rahmenfarben

Farbe CSS-Klasse Beispiel Webfarbe RGB-Farbraum
Standard .border-default        #cccccc R: 204 G: 204 B: 204
Weiß .border-white        #ffffff R: 255 G: 255 B: 255
Hellgrau .border-light        #e9ecef R: 233 G: 236 B: 239
Dunkelgrau .border-dark        #343a40 R: 52 G: 58 B: 64
Schwarz .border-black        #000000 R: 0 G: 0 B: 0
Erfolg (Grün) .border-success        #28a745 R: 40 G: 167 B: 69
Info (Türkis) .border-info        #17a2b8 R: 23 G: 162 B: 184
Warnung (Orange) .border-warning        #ffc107 R: 255 G: 193 B: 7
Achtung (Rot) .border-danger        #dc3545 R: 220 G: 53 B: 69
Primär (Blau) .border-primary        #007bff R: 0 G: 123 B: 255
Sekundär (Grau) .border-secondary        #6c757d R: 108 G: 117 B: 125