Typografie
h1 Headline
h2 Headline
h3 Headline
h4 Headline
h5 Headline
h6 Headline
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Basisschrift Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
h1 Headline
h2 Headline
h3 Headline
h4 Headline
h5 Headline
h6 Headline
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Basisschrift Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Farben
Background
hsl: 0, 0%, 96.08%
rgb: 245, 245, 245
hex: #f5f5f5
rgb: 245, 245, 245
hex: #f5f5f5
hsl: 0, 0%, 91.08%
rgb: 232, 232, 232
hex: #e8e8e8
rgb: 232, 232, 232
hex: #e8e8e8
hsl: 0, 0%, 86.08%
rgb: 220, 220, 220
hex: #dcdcdc
rgb: 220, 220, 220
hex: #dcdcdc
hsl: 0, 0%, 81.08%
rgb: 207, 207, 207
hex: #cfcfcf
rgb: 207, 207, 207
hex: #cfcfcf
hsl: 0, 0%, 76.08%
rgb: 194, 194, 194
hex: #c2c2c2
rgb: 194, 194, 194
hex: #c2c2c2
hsl: 0, 0%, 71.08%
rgb: 181, 181, 181
hex: #b5b5b5
rgb: 181, 181, 181
hex: #b5b5b5
hsl: 0, 0%, 66.08%
rgb: 169, 169, 169
hex: #a9a9a9
rgb: 169, 169, 169
hex: #a9a9a9
hsl: 0, 0%, 61.08%
rgb: 156, 156, 156
hex: #9c9c9c
rgb: 156, 156, 156
hex: #9c9c9c
hsl: 0, 0%, 56.08%
rgb: 143, 143, 143
hex: #8f8f8f
rgb: 143, 143, 143
hex: #8f8f8f
hsl: 0, 0%, 51.08%
rgb: 130, 130, 130
hex: #828282
rgb: 130, 130, 130
hex: #828282
hsl: 0, 0%, 46.08%
rgb: 118, 118, 118
hex: #767676
rgb: 118, 118, 118
hex: #767676
hsl: 0, 0%, 41.08%
rgb: 105, 105, 105
hex: #696969
rgb: 105, 105, 105
hex: #696969
hsl: 0, 0%, 36.08%
rgb: 92, 92, 92
hex: #5c5c5c
rgb: 92, 92, 92
hex: #5c5c5c
hsl: 0, 0%, 31.08%
rgb: 79, 79, 79
hex: #4f4f4f
rgb: 79, 79, 79
hex: #4f4f4f
hsl: 0, 0%, 26.08%
rgb: 67, 67, 67
hex: #434343
rgb: 67, 67, 67
hex: #434343
hsl: 0, 0%, 21.08%
rgb: 54, 54, 54
hex: #363636
rgb: 54, 54, 54
hex: #363636
hsl: 0, 0%, 16.08%
rgb: 41, 41, 41
hex: #292929
rgb: 41, 41, 41
hex: #292929
hsl: 0, 0%, 11.08%
rgb: 28, 28, 28
hex: #1c1c1c
rgb: 28, 28, 28
hex: #1c1c1c
hsl: 0, 0%, 6.08%
rgb: 16, 16, 16
hex: #101010
rgb: 16, 16, 16
hex: #101010
hsl: 0, 0%, 1.08%
rgb: 3, 3, 3
hex: #030303
rgb: 3, 3, 3
hex: #030303
Primary
hsl: 0, 56.52%, 99.61%
rgb: 255, 253, 253
hex: #fffdfd
rgb: 255, 253, 253
hex: #fffdfd
hsl: 0, 56.52%, 94.61%
rgb: 249, 233, 233
hex: #f9e9e9
rgb: 249, 233, 233
hex: #f9e9e9
hsl: 0, 56.52%, 89.61%
rgb: 243, 214, 214
hex: #f3d6d6
rgb: 243, 214, 214
hex: #f3d6d6
hsl: 0, 56.52%, 84.61%
rgb: 238, 194, 194
hex: #eec2c2
rgb: 238, 194, 194
hex: #eec2c2
hsl: 0, 56.52%, 79.61%
rgb: 232, 174, 174
hex: #e8aeae
rgb: 232, 174, 174
hex: #e8aeae
hsl: 0, 56.52%, 74.61%
rgb: 227, 154, 154
hex: #e39a9a
rgb: 227, 154, 154
hex: #e39a9a
hsl: 0, 56.52%, 69.61%
rgb: 221, 134, 134
hex: #dd8686
rgb: 221, 134, 134
hex: #dd8686
hsl: 0, 56.52%, 64.61%
rgb: 216, 114, 114
hex: #d87272
rgb: 216, 114, 114
hex: #d87272
hsl: 0, 56.52%, 59.61%
rgb: 210, 94, 94
hex: #d25e5e
rgb: 210, 94, 94
hex: #d25e5e
hsl: 0, 56.52%, 54.61%
rgb: 205, 74, 74
hex: #cd4a4a
rgb: 205, 74, 74
hex: #cd4a4a
hsl: 0, 56.52%, 49.61%
rgb: 198, 55, 55
hex: #c63737
rgb: 198, 55, 55
hex: #c63737
hsl: 0, 56.52%, 44.61%
rgb: 178, 49, 49
hex: #b23131
rgb: 178, 49, 49
hex: #b23131
hsl: 0, 56.52%, 39.61%
rgb: 158, 44, 44
hex: #9e2c2c
rgb: 158, 44, 44
hex: #9e2c2c
hsl: 0, 56.52%, 34.61%
rgb: 138, 38, 38
hex: #8a2626
rgb: 138, 38, 38
hex: #8a2626
hsl: 0, 56.52%, 29.61%
rgb: 118, 33, 33
hex: #762121
rgb: 118, 33, 33
hex: #762121
hsl: 0, 56.52%, 24.61%
rgb: 98, 27, 27
hex: #621b1b
rgb: 98, 27, 27
hex: #621b1b
hsl: 0, 56.52%, 19.61%
rgb: 78, 22, 22
hex: #4e1616
rgb: 78, 22, 22
hex: #4e1616
hsl: 0, 56.52%, 14.61%
rgb: 58, 16, 16
hex: #3a1010
rgb: 58, 16, 16
hex: #3a1010
hsl: 0, 56.52%, 9.61%
rgb: 38, 11, 11
hex: #260b0b
rgb: 38, 11, 11
hex: #260b0b
hsl: 0, 56.52%, 4.61%
rgb: 18, 5, 5
hex: #120505
rgb: 18, 5, 5
hex: #120505
.button-filled
.button-sm
.button-lg
.button-outline
.button-sm
.button-lg
.button-blank
.button-filled .button-primary
.button-outline .button-primary
.button-filled .button-primary .button-invert
.button-outline .button-primary .button-invert
.button-filled .button-black
.button-outline .button-black
.button-filled .button-white
.button-outline .button-white
Icons
.svg-icon-primary
.svg-icon-primary-hover
.svg-icon-primary-disabled
.svg-icon-primary-contrast
.svg-icon-white
.svg-icon-black
.svg-icon-xs
.svg-icon-sm
.svg-icon-md
.svg-icon-lg
.svg-icon-xl
Schatten
Schatten (small)
.shadow_sm
Schatten (normal)
.shadow_md
Schatten (large)
.shadow_lg
Abstände
–base_clearance_xs
–base_clearance_sm
–base_clearance_md
–base_clearance_lg
–base_clearance_xl
–base_clearance_xxl
Listen
.list-style-1
- Lorem ipsum dolor sit amet
- Dolor sit amet consetetur sadipscing
- At accusam aliquyam diam diam dolore dolores duo eirmod eos erat
- Et nonumy sed tempor et et invidunt justo labore Stet clita ea et gubergren, kasd magna no rebum sanctus sea sed takimata ut vero voluptua
- Duis autem vel eum iriure dolor in hendrerit
.list-style-2
- Lorem ipsum dolor sit amet
- Dolor sit amet consetetur sadipscing
- At accusam aliquyam diam diam dolore dolores duo eirmod eos erat
- Et nonumy sed tempor et et invidunt justo labore Stet clita ea et gubergren, kasd magna no rebum sanctus sea sed takimata ut vero voluptua
- Duis autem vel eum iriure dolor in hendrerit
.list-style-3
- Lorem ipsum dolor sit amet
- Dolor sit amet consetetur sadipscing
- At accusam aliquyam diam diam dolore dolores duo eirmod eos erat
- Et nonumy sed tempor et et invidunt justo labore Stet clita ea et gubergren, kasd magna no rebum sanctus sea sed takimata ut vero voluptua
- Duis autem vel eum iriure dolor in hendrerit
.list-style-4
- Lorem ipsum dolor sit amet 9.00 €
- Dolor sit amet consetetur sadipscing 7.50 €
- At accusam aliquyam diam diam dolore dolores duo eirmod eos erat 21.00 €
- Et nonumy sed tempor et kasd magna no vero voluptua 23.50 €
- Duis autem vel eum iriure dolor in hendrerit +2 €
.list-style-5
- Lorem ipsum dolor sit amet
- Dolor sit amet consetetur sadipscing
- At accusam aliquyam diam diam dolore dolores duo eirmod eos erat
- Et nonumy sed tempor et et invidunt justo labore Stet clita ea et gubergren, kasd magna no rebum sanctus sea sed takimata ut vero voluptua
- Duis autem vel eum iriure dolor in hendrerit
Lorem ipsum
dolor sit amet consetetur sadipscing elitr sed diam nonumy eirmod
tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est.
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consetetur sadipscing elitr
Sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
Sed diam nonummy nibh
Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.
Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Ut wisi enim ad minim veniam
Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis.
At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, At accusam aliquyam diam diam dolore dolores duo eirmod eos erat, et nonumy sed tempor et et invidunt justo labore Stet clita ea et gubergren, kasd magna no rebum. sanctus sea sed takimata ut vero voluptua. est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.
Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
- Lorem ipsum dolor sit amet
- Dolor sit amet consetetur sadipscing
- At accusam aliquyam diam diam dolore dolores duo eirmod eos erat
- Et nonumy sed tempor et et invidunt justo labore Stet clita ea et gubergren, kasd magna no rebum sanctus sea sed takimata ut vero voluptua
- Duis autem vel eum iriure dolor in hendrerit
Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis.
At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, At accusam aliquyam diam diam dolore dolores duo eirmod eos erat, et nonumy sed tempor et et invidunt justo labore Stet clita ea et gubergren, kasd magna no rebum. sanctus sea sed takimata ut vero voluptua. est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur