Overview
Search
Clear search query
Design Tokens
colors
sizes
typography
components
elements
button
Primary Button
Primary Button Disabled
Primary Button with Icon right
Primary Button with Icon left
Primary Button with Icon and reduced on mobile
Secondary Button
Secondary Button Disabled
Secondary Button with Icon Right
Secondary Button with Icon Left
Secondary Button with Icon and reduced on mobile
Donation Button
Donation Button Disabled
Donation Button with Icon right
Donation Button with Icon left
Donation Button with Icon and reduced on mobile
Default Link
Link with Icon right
Link with Icon left
Link with Icon and reduced on mobile
Kids Primary Button
Kids Secondary Button
contrast switcher
default
countdown
default
dialog
default
donation example
large
small
small without image
flex embed
default
Ratio 2x1
Ratio 3x1
Ratio 4x3
Ratio 16x9
Ratio 2x3
Ratio dynamic
flyout
default
gift prompt
default
Simple version
hubspot
default
icon
arrow
at-sign
calendar
check
check-circle
checkbox-checked
checkbox-empty
chevron
clock
credit-card
cross
download
double-heart
edit
external-link
facebook
file
filter
flag
gift
green-arrow
heart
home
info
lock
logo
mail
map-pin
mastercard
maximize
menu
minus
more
phone
paypal
play
printer
search
share
shield
shopping-bag
stars
whatsapp
user
visa
iframe
Issuu
Google Maps
Soundcloud
Tiki Toki
Vimeo
Spotify
Youtube
Instagram
with max width
with 16/9 fallback ratio
with mobile 9/16 aspect ratio
image
default
Same Ratio
Same Ratio 16 9
Same Ratio Portrait
Different Ratio
Retina
Stage
Stage Small
Teaser
Teaser medium
Image teaser
image teaser
default
lightbox
with opener and image
with opener and without image
without opener
link
default
Underlined Link
Link with Icon left
Link with Icon right
Kids Link
loading animation
default
Animation with text
media template
Youtube video
Youtube video with image overlay
Landscape image
Landscape image full
Portrait image
Portrait image full
multiselect
default
progress
default
progress bar
default
minimal
progress tracker
default
on donation teaser
on review data page
rte
default
Short
Headlines
Lists
search result
Default
default without image
Portrait
share
default
Centered on mobile
tags
default
teaser
default
Landscape
Landscape visual kids
Small
Kids
Visual kids
Engagement
Engagement landscape
Petition
Petition landscape
Petition without progress bar
fsk
form
checkboxes
Column
Row
fieldset
default
complete
form element
Input
Input invalid
Input with description
Input invalid with description
Select
Textarea
Checkbox
Checkbox invalid
Checkbox checked
Checkbox disabled
Checkbox invalid and checked
Checkbox invalid and disabled
Checkbox checked and disabled
Checkbox checked and disabled and invalid
Radio
Radio invalid
Radio checked
Radio disabled
Radio invalid and checked
Radio invalid and disabled
Radio checked and disabled
Radio checked and disabled and invalid
Submit
form element label
default
Required
input
default
Invalid
Filled out
Disabled
Invalid and filled-out
Invalid and disabled
Filled out and disabled
Filled out and disabled and invalid
input checkbox
default
Invalid
Checked
Disabled
Invalid and checked
Invalid and disabled
Checked and disabled
Checked and disabled and invalid
input date
default
Invalid
Filled out
Disabled
Invalid and filled-out
Invalid and disabled
Filled out and disabled
Filled out and disabled and invalid
input email
default
Invalid
Filled out
Disabled
Invalid and filled-out
Invalid and disabled
Filled out and disabled
Filled out and disabled and invalid
input file
default
Invalid
Filled out
Disabled
Invalid and filled-out
Invalid and disabled
Filled out and disabled
Filled out and disabled and invalid
input number
default
Invalid
Filled out
Disabled
Invalid and filled-out
Invalid and disabled
Filled out and disabled
Filled out and disabled and invalid
input password
default
Invalid
Filled out
Disabled
Invalid and filled-out
Invalid and disabled
Filled out and disabled
Filled out and disabled and invalid
input radio
default
Invalid
Checked
Disabled
Invalid and checked
Invalid and disabled
Checked and disabled
Checked and disabled and invalid
input range
default
Invalid
Filled out
Disabled
Invalid and filled-out
Invalid and disabled
Filled out and disabled
Filled out and disabled and invalid
input submit
Primary button
Primary button with icon
Primary disabled button
Primary disabled button with icon
Secondary button
Secondary button with icon
Secondary disabled button
Secondary disabled button with icon
input tel
default
Invalid
Filled out
Disabled
Invalid and filled-out
Invalid and disabled
Filled out and disabled
Filled out and disabled and invalid
input textfield
default
Invalid
Filled out
Disabled
Invalid and filled-out
Invalid and disabled
Filled out and disabled
Filled out and disabled and invalid
select
default
Invalid
Disabled
Invalid and disabled
With optgroups
textarea
default
Invalid
Filled out
Disabled
Invalid and filled-out
Invalid and disabled
Filled out and disabled
Filled out and disabled and invalid
forms
form
default
radios
Column
Row
patterns
accordion
default
Materials
narrow
archive marker
default
article meta info
default
authors list
default
breadcrumb
default
kids
buttons
Button primary
Button secondary
Button tertiary link
Button primary and Link
Button secondary and Link
Button donation
Button donation and Link
Kids Button primary and Link
chatbot teaser
default
contact persons
default
only name
with headline
with image
with short bio
with image and short bio
with multiple contact persons
contact channel
Mail
Phone
content embed
iFrame issuu
with max-width
without own container
iFrame Vimeo
Twitter Embed
youtube with image overlay
spotify with custom aspect ratio
content with headline
donation examples
default
donation teaser
default
on multisteps form (with progress)
alternative multistep version
alternative multistep version (radios)
alternative multistep version (slider)
alternative multistep version (slider and double donation)
alternative multistep version double donation
small
As part of the donation form
Progressbar
Progressbar and countdown
teaser body
default
double donation
with slider
with slider and double donation
with radio buttons
expendable block
default
form
checkout
checkout info
default
checkout list
default
material
checkout list intro
default
checkout list item
Donation Amount
Personal Data
Payment
Gift
Material order
form input date
default
form orders control
default
form submission
default
form validation
default
fsk form element
gift option
default
layout
layout button
default
default with loading
as link
as donation
layout buttons
default
checkout
inline buttons
layout fieldset
default
Full width
payment
payment amount
default
with select
supporter name
default
required field info
default
textarea
default
further questions
default
contacts list
default
gift certificate
default
green strip
default
greenwire teaser
default
full
highlight
with natural bg
with texture bg
with white bg
with headline
with marker headline
with long marker headline
with zigzag headline
with long zigzag headline
with squiggle headline
with long squiggle headline
with headline and button
with headline and donation button
with media
with media and button
with media and textblock align left
with long marker headline and textblock align left
with long zigzag headline and textblock align left
with long squiggle headline and textblock align left
image gallery
default
image teasers
default
infobox
Three columns
Two columns
One column
js warning
default
list
unordered
ordered
checked
unchecked
failed
checked with overwrites
unchecked with overwrites
failed with overwrites
without headline
material
Publication
Publication with alt pdf and url
Education
Education with email button
Info
Info as element
Info with radio buttons
material header
default
motive
default
Eight variants
Ten variants
Twelve variants
motive lightbox
default
newsletter teaser
default
pager
default
petition teaser
default
Two lines background
Three lines background
Without id
quote
default
with image
with link
rating
default
search
default
Educational materials
filters
default
Education materials
query
default
results amount
default
sorting
Descending (absteigend)
Ascending (aufsteigend)
With search results
search results
default
Portrait results
sharing
default
Image with caption and copyright
Without image
stage
default
Stage with copyright
Stage with text right
Small Stage with text left top
Small Stage with text left bottom
Small Stage with text right top
Small Stage with text right bottom
Stage with Share
Stage Kids
Stage Kids with Share
Stage with long word
with donation form
with donation form - donation-friendly position
sub navigation
default
tabs
default
tabs content
Graph
Teasers
Stats
tabs graph
tabs stats
tabs list
default
Interactive
tags sharing
default
tax form
default
teasers
One column teasers
Two columns teasers
Three columns teasers
Kids
testimonial
Three testimonials with button
Two testimonials without button
Seven testimonials with button
text media
Only rte
Only rte short
Only landscape image
Only portrait image
Only youtube video
Only youtube video with the cover image
Rte with right video
Rte short with right video
Rte with left video
Rte with left landscape image
Rte with right landscape image
Rte with left portrait image
Rte with right portrait image
Rte with left image and list
Rte with right image and lists
Full width
template components
certificate
double opt in lightbox
default
footer
default
Footer Kids
Footer small
affiliates menu
default
donation info
default
legal menu
default
news letter
default
social networks
default
header
default
Kids
Jugend
main navigation
default
dropdown list
default
dropdown menu
Climate protection
Biodiversity
Peace
Donations
Participate
About us
dropdown submenu
default
overview link
Climate protection
Biodiversity
Peace
Donations
Participate
About us
meta navigation
default
search bar
default
overlay teaser
default
overlay teaser content
Closed
Opened
One click
paypal error lightbox
default
templates
default page
Basic Page (Einfache Seite)
Landing Page (Startseite)
Topic Page (Verteilerseite)
Error Page (Fehlerseite)
Search (Suche)
Educational material (Bildungsmaterial-Detailseite)
Educational materials Search (Bildungsmaterial Suche)
Publications (Publikationen-Detailseite)
Send gift donation
Automated list of all content
Open Settings
Close Settings
Color scheme
light
dark
auto
Text direction
left to right
<
right to left
Development mode
Go to…
elements/button
elements/contrast-switcher
elements/countdown
elements/dialog
elements/donation-example
elements/flex-embed
elements/flyout
elements/gift-prompt
elements/hubspot
elements/icon
elements/iframe
elements/image
elements/image-teaser
elements/lightbox
elements/link
elements/loading-animation
elements/media-template
elements/multiselect
elements/progress
elements/progress-bar
elements/progress-tracker
elements/rte
elements/search-result
elements/share
elements/tags
elements/teaser
fsk
fsk/form/checkboxes
fsk/form/fieldset
fsk/form/form-element
fsk/form/form-element/form-element-label
fsk/form/form-element/input
fsk/form/form-element/input/input--checkbox
fsk/form/form-element/input/input--date
fsk/form/form-element/input/input--email
fsk/form/form-element/input/input--file
fsk/form/form-element/input/input--number
fsk/form/form-element/input/input--password
fsk/form/form-element/input/input--radio
fsk/form/form-element/input/input--range
fsk/form/form-element/input/input--submit
fsk/form/form-element/input/input--tel
fsk/form/form-element/input/input--textfield
fsk/form/form-element/input/select
fsk/form/form-element/input/textarea
fsk/form/forms/form
fsk/form/radios
patterns/accordion
patterns/archive-marker
patterns/article-meta-info
patterns/authors-list
patterns/breadcrumb
patterns/buttons
patterns/chatbot-teaser
patterns/contact-persons
patterns/contact-persons/contact-channel
patterns/content-embed
patterns/donation-examples
patterns/donation-teaser
patterns/donation-teaser/teaser-body
patterns/expendable-block
patterns/form/checkout/checkout-info
patterns/form/checkout/checkout-list
patterns/form/checkout/checkout-list/checkout-list-intro
patterns/form/checkout/checkout-list/checkout-list-item
patterns/form/form-input-date
patterns/form/form-orders-control
patterns/form/form-submission
patterns/form/form-validation
patterns/form/gift-option
patterns/form/layout/layout-button
patterns/form/layout/layout-buttons
patterns/form/layout/layout-fieldset
patterns/form/payment/payment-amount
patterns/form/payment/supporter-name
patterns/form/required-field-info
patterns/form/textarea
patterns/further-questions
patterns/further-questions/contacts-list
patterns/gift-certificate
patterns/green-strip
patterns/greenwire-teaser
patterns/highlight
patterns/image-gallery
patterns/image-teasers
patterns/infobox
patterns/js-warning
patterns/list
patterns/material
patterns/material-header
patterns/motive
patterns/motive/motive-lightbox
patterns/newsletter-teaser
patterns/pager
patterns/petition-teaser
patterns/quote
patterns/rating
patterns/search
patterns/search/filters
patterns/search/query
patterns/search/results-amount
patterns/search/sorting
patterns/search-results
patterns/sharing
patterns/stage
patterns/sub-navigation
patterns/tabs
patterns/tabs/tabs-content
patterns/tabs/tabs-content/tabs-graph
patterns/tabs/tabs-content/tabs-stats
patterns/tabs/tabs-list
patterns/tags-sharing
patterns/tax-form
patterns/teasers
patterns/testimonial
patterns/text-media
template-components/certificate
template-components/double-opt-in-lightbox
template-components/footer
template-components/footer/affiliates-menu
template-components/footer/donation-info
template-components/footer/legal-menu
template-components/footer/news-letter
template-components/footer/social-networks
template-components/header
template-components/header/main-navigation
template-components/header/main-navigation/dropdown-list
template-components/header/main-navigation/dropdown-menu
template-components/header/main-navigation/dropdown-submenu
template-components/header/main-navigation/overview-link
template-components/header/meta-navigation
template-components/header/search-bar
template-components/overlay-teaser
template-components/overlay-teaser/overlay-teaser-content
template-components/paypal-error-lightbox
templates/default-page
