Style Guide

Lumos | v2.0.4

Typography

Font Styles

u-text-display

Display

u-text-h1

Heading

u-text-h2

Heading

u-text-h3

Heading

u-text-h4

Heading

u-text-h5
Heading
u-text-h6
Heading
u-text-subtitles
Subtitles
u-text-quotes
Quotes
u-text-large

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare

u-text-medium

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare

u-text-main

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare

u-text-small

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare

u-text-link
Text Link

Font Weight

u-weight-regular

Lorem ipsum dolor

u-weight-medium

Lorem ipsum dolor

u-weight-bold

Lorem ipsum dolor

Text alignment

u-text-aligned-left

Lorem ipsum dolor

u-text-aligned-center

Lorem ipsum dolor

u-text-aligned-right

Lorem ipsum dolor

Text wrap

u-text-wrap-balance

Lorem ipsum dolor

u-text-wrap-pretty

Lorem ipsum dolor

Line Clamp

u-line-clamp-1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

u-line-clamp-2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

u-line-clamp-3

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

u-line-clamp-4

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Typography Elements

Ordered List
  1. This is some text
  2. This is some text
  3. This is some text
  1. This is some text
  2. This is some text
  3. This is some text
  1. This is some text
  2. This is some text
  3. This is some text
Unordered List
  • This is some text
  • This is some text
  • This is some text
  • This is some text what happens if the text is long
  • This is some text
  • This is some text
  • This is some text what happens if the text is long
  • This is some text
u-rich-text

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Lorem ipsum

Lorem ipsum dolor sit amet, consectetur

Text Link

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Lorem ipsum

Lorem ipsum dolor sit amet, consectetur

Text Link

Block Quotes
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do

Color

Themes

data-theme="light"

Heading

Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

Text Link
data-theme="dark"

Heading

Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

Text Link
data-theme="invert"

Heading

Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

Text Link
data-theme="inherit"

Heading

Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

Text Link

Font Families

u-font-body

Lorem ipsum dolor

u-font-heading

Lorem ipsum dolor

u-font-decoration

Lorem ipsum dolor

u-font-display

Lorem ipsum dolor

Text Color

u-text-color-primary

Lorem ipsum dolor

u-text-color-secondary

Lorem ipsum dolor

u-text-color-tertiary

Lorem ipsum dolor

u-text-color-black

Lorem ipsum dolor

u-text-color-brand

Lorem ipsum dolor

u-text-color-red

Lorem ipsum dolor

u-text-color-green

Lorem ipsum dolor

u-color-inherit

Lorem ipsum dolor

u-color-faded

Lorem ipsum dolor

Link Color

u-link-color
u-link-color-secondary

Background Colors

u-bg-color
u-bg-color-secondary
u-bg-color-tertiary
u-bg-color-alternate

Flexbox

Horizontal Flex Utilities

u-hflex-left-top
u-hflex-left-center
u-hflex-left-bottom
u-hflex-left-stretch
u-hflex-center-top
u-hflex-center-center
u-hflex-center-bottom
u-hflex-center-stretch
u-hflex-right-top
u-hflex-right-center
u-hflex-right-bottom
u-hflex-right-stretch
u-hflex-between-top
u-hflex-between-center
u-hflex-between-bottom
u-hflex-between-stretch

Vertical Flex Utilities

u-vflex-left-top
u-vflex-left-center
u-vflex-left-bottom
u-vflex-left-between
u-vflex-center-top
u-vflex-center-center
u-vflex-center-bottom
u-vflex-center-between
u-vflex-right-top
u-vflex-right-center
u-vflex-right-bottom
u-vflex-right-between
u-vflex-stretch-top
u-vflex-stretch-center
u-vflex-stretch-bottom
u-vflex-stretch-between

Other Flex Utilities

u-hflex-wrap
u-vflex-wrap
u-flex-shrink
u-flex-grow
u-flex-noshrink

Align Self Utilities

u-align-self-auto
u-align-self-start
u-align-self-center
u-align-self-end
u-align-self-stretch

Align Items Utilities

u-align-items-variable
u-align-items-start
u-align-items-center
u-align-items-end
u-align-items-stretch

Grid

Grid Utilities

u-grid-custom
u-grid-breakout
u-grid-desktop
u-grid-tablet
u-grid-landscape
u-grid-column-2
u-grid-column-3
u-grid-column-4
u-grid-autofit
u-grid-subgrid

Column Utilities

u-column-custom
u-column-full
u-column-indent
u-column-1
u-column-2
u-column-3
u-column-4
u-column-5
u-column-6
u-column-7
u-column-8
u-column-9
u-column-10
u-column-11
u-column-12

Order Utilities

u-order-first
u-order-first-desktop
u-order-first-tablet
u-order-last
u-order-last-desktop
u-order-last-tablet

Spacing

Gap Utilities

u-gap-none
u-gap-main
u-gap-xxsmall
u-gap-xsmall
u-gap-small
u-gap-medium
u-gap-large
u-gap-xlarge

Row Gap Utilities

u-gap-row-none
u-gap-row-main
u-gap-row-xsmall
u-gap-row-small
u-gap-row-medium
u-gap-row-large
u-gap-row-xlarge

Column Gap Utilities

u-gap-column-none
u-gap-column-main
u-gap-column-xsmall
u-gap-column-small
u-gap-column-medium
u-gap-column-large
u-gap-column-xlarge

Section Spacing Attributes

data-padding-top="none"
data-padding-bottom="none"
data-padding-top="small"
data-padding-bottom="small"
data-padding-top="main"
data-padding-bottom="main"
data-padding-top="large"
data-padding-bottom="large"

Custom Spacing Classes

u-section-header

Margin Top Utilities

u-mt-auto
u-mt-gutter
u-mt-text
u-mt-0
u-mt-1
u-mt-2
u-mt-3
u-mt-4
u-mt-5
u-mt-6
u-mt-7

Margin Bottom Utilities

u-mb-auto
u-mb-gutter
u-mb-text
u-mb-0
u-mb-1
u-mb-2
u-mb-3
u-mb-4
u-mb-5
u-mb-6
u-mb-7

Z-Index

Z-Index

u-zindex-2
u-zindex-3

Miscellaneous

Other Utilities

u-height-screen
u-min-height-70
u-min-height-60
u-max-width-none
u-visual-wrap
u-display-none
u-hide-portrait
u-hide-landscape
u-hide-tablet
u-cover
u-cover-absolute
u-container
u-sr-only
u-margin-trim
u-hide-if-empty
u-hide-if-empty-cms

Positions

Positions

u-position-relative
u-position-absolute
u-position-fixed
u-position-sticky

Prevent Style Cleanup

Eyebrow Text Here

Lorem ipsum dolor sit

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

Ohne Kreditkarte

Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

Badge
Bitte Business-E-mail verwenden.

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Block quote

Ordered list

  1. Item 1
  2. Item 2
  3. Item 3

Unordered list

  • Item A
  • Item B
  • Item C

Text link

Bold text

Emphasis

Superscript

Subscript

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Block quote

Ordered list

  1. Item 1
  2. Item 2
  3. Item 3

Unordered list

  • Item A
  • Item B
  • Item C

Text link

Bold text

Emphasis

Superscript

Subscript

Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

Eyebrow Text Here

Lorem ipsum dolor sit

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

3 Tricks, um aussichtsreiche Bewerber*innen nicht an die Konkurrenz zu verlieren

Wahrscheinlich waren auch Sie schon mal in folgender Situation: Sie haben sich durch endlose Lebensläufe und Interviews gekämpft und schicken schlussendlich eine Zusage an den oder die beste*n Bewerber*in. Jetzt freuen Sie sich auf die gute Zusammenarbeit. Dann jedoch kommt der Schock: Die Person sagt ab, weil sie bereits einen anderen Job angenommen hat. Für die Absage kann es mehrere Gründe geben. Entweder ist die Person von Ihrem Unternehmen oder der angebotenen Stelle doch nicht so begeistert. Oder sie hat von einem anderen Unternehmen ein höheres Gehalt angeboten bekommen. Oder aber, Sie waren mit Ihrer Zusage einfach zu langsam. Damit uns diese Situation möglichst erspart bleibt, haben wir bei onapply die folgenden drei Best Practices.

#1 Bewerber*innen von der Bewerbung bis zur Zusage begeistern

Jeder hat schon einmal von »Candidate Experience« – die Erfahrung, die Bewerber*innen mit dem Bewerbungsprozess machen – gelesen, angefangen vom Absenden der Bewerbung bis hin zur Zusage. Hierbei ist es wichtig, jede*n einzelne*n Bewerber*in mit Respekt zu behandeln. Respekt heißt in diesem Zusammenhang für uns, dass jede*r Bewerber*in eine Rückmeldung, ehrliches Feedback und einen möglichst umfassenden Überblick über die fachlichen Herausforderungen der Stelle erhält und das möglichst zeitnah. Das erreichen wir durch einen strammen, strukturierten Prozess, der es erlaubt, dass wir den oder die Bewerber*in sehr gut kennenlernen – und umgekehrt.

#2 Seien Sie schneller als die Konkurrenz

Um zu verstehen, warum Sie in Ihrem Bewerbungsprozess schnell sein müssen, sehen wir uns einmal den Zeitstrahl eines Bewerbungsprozesses aus der Sicht von Bewerber*innen an: Bewerber*innen suchen sich im ersten Schritt (erste Bewerbungswelle) beispielsweise 10 bekannte Unternehmen heraus, bei denen sie sich vorstellen können, zu arbeiten. Dies sind oft große Unternehmen, die viel TV-Werbung machen, Großveranstaltungen an Unis organisieren, Vereine sponsern oder häufig in der Presse auftauchen. Nach zwei Wochen (zweite Bewerbungswelle) schreiben sie Bewerbungen an kleinere Unternehmen, deren Stellenausschreibungen interessant klingen oder die auf verschiedenen Jobbörsen gelistet sind. Nach vier Wochen schreiben Bewerber*innen die dritte Welle an Bewerbungen an eine Vielzahl von kleineren Unternehmen. Wir, als sehr kleines Unternehmen, das in den Medien kaum vertreten ist, erhalten die Bewerbung der zweiten, dritten oder sogar vierten Bewerbungswelle. Auch Ihnen wird es wahrscheinlich in Ihrem Unternehmen ähnlich gehen. Das heißt, ein großer Konzern hat zwei bis sechs Wochen Vorsprung, Bewerber*innen ein gutes Angebot zu machen. Wir haben daraus gelernt, dass wir schneller sein müssen, als konkurrierende Unternehmen. Unser Prozess, von Bewerbung bis Zusage, darf nicht länger als eine Woche, maximal aber zwei Wochen dauern. Falls er aus irgendeinem Grund länger dauert, haben wir den Kandidaten oder die Kandidatin mit hoher Wahrscheinlichkeit schon verloren.

#3 Dem Bewerber das richtige Gesamtpaket anbieten

Heutzutage ist Geld (glücklicherweise) nicht mehr der wichtigste Benefit, den Sie Bewerber*innen anbieten können. Ein kollegiales Umfeld und ein erfüllender Job sind stattdessen heute die Haupt-Motivationsfaktoren. Auf den nachfolgenden Plätzen findet man ein angemessenes Gehalt, eine gute Führungskraft und genügend Entscheidungsfreiräume (Studie der Hay Group). Das heißt für uns: Wir müssen Bewerber*innen im Bewerbungsprozess zeigen, dass unser Unternehmen all dies bieten kann und wir trotz allem ein angemessenes Gehalt zahlen. Kann Ihr Unternehmen die Motivationsfaktoren der Kandidat*innen nicht bedienen, müssen Sie allerdings eventuell tiefer in die Taschen greifen, um sie zu überzeugen.

Fazit

Eine*n Bewerber*in in einer weit fortgeschrittenen Phase des Bewerbungsprozesses zu verlieren, ist gerade für kleinere Unternehmen sehr ärgerlich. Wenn Sie Ihre Bewerber*innen von der ersten bis zur letzten Minute begeistern, schneller als Ihre Konkurrenten entscheiden und ein gutes Gesamtpaket aus Motivationsfaktoren und Gehalt anbieten, haben Sie gute Chancen, Ihren Wunschkandidaten oder Ihre Wunschkandidatin am Ende auch erfolgreich einstellen zu können. Haben Sie immer die passenden Worte! Mit unseren Vorlagen für Ihre Bewerber-Kommunikation.

3 Tricks, um aussichtsreiche Bewerber*innen nicht an die Konkurrenz zu verlieren

Erfahren Sie, wie Sie aussichtsreiche Bewerber\*innen nicht an die Konkurrenz verlieren: 3 Tricks, um Ihren Bewerbungsprozess zu optimieren.

Zuletzt aktualisiert:
3.12.2025

3 Tricks, um aussichtsreiche Bewerber*innen nicht an die Konkurrenz zu verlieren

Wahrscheinlich waren auch Sie schon mal in folgender Situation: Sie haben sich durch endlose Lebensläufe und Interviews gekämpft und schicken schlussendlich eine Zusage an den oder die beste*n Bewerber*in. Jetzt freuen Sie sich auf die gute Zusammenarbeit. Dann jedoch kommt der Schock: Die Person sagt ab, weil sie bereits einen anderen Job angenommen hat. Für die Absage kann es mehrere Gründe geben. Entweder ist die Person von Ihrem Unternehmen oder der angebotenen Stelle doch nicht so begeistert. Oder sie hat von einem anderen Unternehmen ein höheres Gehalt angeboten bekommen. Oder aber, Sie waren mit Ihrer Zusage einfach zu langsam. Damit uns diese Situation möglichst erspart bleibt, haben wir bei onapply die folgenden drei Best Practices.

#1 Bewerber*innen von der Bewerbung bis zur Zusage begeistern

Jeder hat schon einmal von »Candidate Experience« – die Erfahrung, die Bewerber*innen mit dem Bewerbungsprozess machen – gelesen, angefangen vom Absenden der Bewerbung bis hin zur Zusage. Hierbei ist es wichtig, jede*n einzelne*n Bewerber*in mit Respekt zu behandeln. Respekt heißt in diesem Zusammenhang für uns, dass jede*r Bewerber*in eine Rückmeldung, ehrliches Feedback und einen möglichst umfassenden Überblick über die fachlichen Herausforderungen der Stelle erhält und das möglichst zeitnah. Das erreichen wir durch einen strammen, strukturierten Prozess, der es erlaubt, dass wir den oder die Bewerber*in sehr gut kennenlernen – und umgekehrt.

#2 Seien Sie schneller als die Konkurrenz

Um zu verstehen, warum Sie in Ihrem Bewerbungsprozess schnell sein müssen, sehen wir uns einmal den Zeitstrahl eines Bewerbungsprozesses aus der Sicht von Bewerber*innen an: Bewerber*innen suchen sich im ersten Schritt (erste Bewerbungswelle) beispielsweise 10 bekannte Unternehmen heraus, bei denen sie sich vorstellen können, zu arbeiten. Dies sind oft große Unternehmen, die viel TV-Werbung machen, Großveranstaltungen an Unis organisieren, Vereine sponsern oder häufig in der Presse auftauchen. Nach zwei Wochen (zweite Bewerbungswelle) schreiben sie Bewerbungen an kleinere Unternehmen, deren Stellenausschreibungen interessant klingen oder die auf verschiedenen Jobbörsen gelistet sind. Nach vier Wochen schreiben Bewerber*innen die dritte Welle an Bewerbungen an eine Vielzahl von kleineren Unternehmen. Wir, als sehr kleines Unternehmen, das in den Medien kaum vertreten ist, erhalten die Bewerbung der zweiten, dritten oder sogar vierten Bewerbungswelle. Auch Ihnen wird es wahrscheinlich in Ihrem Unternehmen ähnlich gehen. Das heißt, ein großer Konzern hat zwei bis sechs Wochen Vorsprung, Bewerber*innen ein gutes Angebot zu machen. Wir haben daraus gelernt, dass wir schneller sein müssen, als konkurrierende Unternehmen. Unser Prozess, von Bewerbung bis Zusage, darf nicht länger als eine Woche, maximal aber zwei Wochen dauern. Falls er aus irgendeinem Grund länger dauert, haben wir den Kandidaten oder die Kandidatin mit hoher Wahrscheinlichkeit schon verloren.

#3 Dem Bewerber das richtige Gesamtpaket anbieten

Heutzutage ist Geld (glücklicherweise) nicht mehr der wichtigste Benefit, den Sie Bewerber*innen anbieten können. Ein kollegiales Umfeld und ein erfüllender Job sind stattdessen heute die Haupt-Motivationsfaktoren. Auf den nachfolgenden Plätzen findet man ein angemessenes Gehalt, eine gute Führungskraft und genügend Entscheidungsfreiräume (Studie der Hay Group). Das heißt für uns: Wir müssen Bewerber*innen im Bewerbungsprozess zeigen, dass unser Unternehmen all dies bieten kann und wir trotz allem ein angemessenes Gehalt zahlen. Kann Ihr Unternehmen die Motivationsfaktoren der Kandidat*innen nicht bedienen, müssen Sie allerdings eventuell tiefer in die Taschen greifen, um sie zu überzeugen.

Fazit

Eine*n Bewerber*in in einer weit fortgeschrittenen Phase des Bewerbungsprozesses zu verlieren, ist gerade für kleinere Unternehmen sehr ärgerlich. Wenn Sie Ihre Bewerber*innen von der ersten bis zur letzten Minute begeistern, schneller als Ihre Konkurrenten entscheiden und ein gutes Gesamtpaket aus Motivationsfaktoren und Gehalt anbieten, haben Sie gute Chancen, Ihren Wunschkandidaten oder Ihre Wunschkandidatin am Ende auch erfolgreich einstellen zu können. Haben Sie immer die passenden Worte! Mit unseren Vorlagen für Ihre Bewerber-Kommunikation.

Blogbeiträge

Entdecken Sie weitere informative Artikel

Change Management für Ihre Recruiting-Software

Recruiting-Software einführen ohne Widerstände: So gelingt Change Management mit klaren Prozessen und hoher Akzeptanz im Unternehmen.

KI im Recruiting: Datenschutz & EU-KI-Verordnung 2026

Was ist bei KI im Recruiting erlaubt? Die EU-KI-Verordnung bringt neue Pflichten für HR. Risiken, Datenschutz & Praxisbeispiele für DACH.

Mitarbeiter motivieren ohne finanzielle Anreize

Entdecken Sie 7 wissenschaftlich fundierte Methoden, um Mitarbeiter ohne finanzielle Anreize nachhaltig zu motivieren und langfristig zu binden.