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.

Die besten Ideen für ein Recruiting-Event

Die gute Nachricht: Schon sehr einfache Events können Ihre potenziellen Bewerber*innen beeindrucken. Ihr Event muss nicht besonders aufwändig sein.
Verknüpfen Sie ein Abendessen mit Lerninhalten.

  • Veranstalten Sie ein Abendessen auf einer Burg, wo Sie ihr Unternehmen vorstellen und Ihre Kolleg*innen gemeinsam mit den potenziellen Bewerber*innen essen. Das Ambiente wird allein schon für Gesprächsstoff sorgen.
  • Geben Sie einen Benimmkurs für Ihre zukünftigen Bewerber*innen und Ihre Mitarbeiter*innen. Dieser Kurs lässt sich optimal mit einem Abendessen verknüpfen, wo das Gelernte gleich angewendet werden kann.
  • Laden Sie zu einem Cocktail-Kurs ein.

  • Sie hatten oder haben ein echtes Problem? Veranstalten Sie doch einen Workshop, in dem Sie frische Ideen erhalten und den potenziellen neuen Mitarbeiter*innen beim Problem-Lösen zuschauen können.

  • Kreieren Sie eine Fallstudie. Das Erstellen ist zwar einmalig aufwendig, dafür können Sie sie aber auch immer wieder benutzen.
  • Veranstalten Sie einen Hackathon. Bei diesem zwei bis drei Tage dauernden Event müssen die potenziellen Bewerber*innen ein bestimmtes Problem lösen und ihre Lösung präsentieren. Der Bonus: Sie können jeden Fachbereich prüfen.

  • Von Messen als Rekrutierungswerkzeug möchte ich Ihnen abraten. Der Grund ist einfach, dass Sie dort aus einer Masse an attraktiven Konkurrenten hervorstechen müssen. Die Zielgruppe ist bei solchen Messen meist undefiniert und Azubi- oder Uni-Messen werden oft von Teilnehmer*innen besucht, die im Rahmen des Unterrichts hier sind, nicht auf freiwilliger Basis.

    Die Organisation eines Rekrutierungsevents

    Die Organisation Ihres Events will gut geplant sein. Nur dann kann es ein voller Erfolg werden. Hier ein paar Tipps:

  • Fangen Sie so früh wie möglich mit der Planung an.
  • legen Sie einen zeitlichen Fahrplan fest
  • legen Sie das Budget für Ihr Event fest
  • informieren Sie Ihre Mitarbeiter*innen, sodass diese sich vorbereiten und die Marketingtrommel rühren können.
  • erstellen Sie dazu am besten Kalendereinträge für Ihre Kolleg*innen
  • Entscheiden Sie sich für eine Eventart und den Ort.
  • achten Sie darauf, die richtige Zielgruppe anzusprechen
  • stellen Sie sicher, dass der Ort gut zu erreichen ist
  • wenn er nicht gut zu erreichen ist: stellen Sie die Logistik sicher
  • organisieren Sie Essen & Getränke, z. B. durch ein professionelles Catering oder durch die Location
  • überlegen Sie sich ein passendes Datum
  • denken Sie dabei bitte an Großveranstaltungen wie die EM, WM, Festivals, Wahlen und ähnliche
  • Vergessen Sie nicht, die Teilnehmer*innen am Tag des Events einzuchecken und willkommen zu heißen
  • Haben Sie Give-Aways? Diese sollten am besten zum Abschied verteilt werden
  • Maximale Teilnahme-Erfolgschancen durch das Anschreiben von fachspezifischen Gruppen

    “Das klingt ja alles wunderbar und woher bekomme ich jetzt die passenden Teilnehmer*innen für das Event her?”
    Dazu gibt es verschiedene Möglichkeiten. Wir empfehlen, genau dorthin zu gehen, wo Ihre Zielgruppe sich trifft. Diese fachspezifischen Gruppen können Online-Foren, Offline Meetups, Universitäten und eine Reihe weiterer Orte sein. Hier werden Sie sehr zielgenau die Menschen treffen, die Sie auf Ihrem Event sehen wollen. Und mit hoher Wahrscheinlichkeit werden sie auch zusagen. Wer sagt schließlich nein zu einer kostenlosen Fortbildung, Austausch mit Expert*innen aus dem eigenen Bereich und einem kostenlosen Essen?
    Weitere Teilnehmer*innen können Sie über Ihren Talentpool und über Werbekampagnen in sozialen Netzwerken ansprechen.
    Damit Sie die Teilnehmer*innen erfassen können, empfehlen wir, eine Software zu nutzen, in der sich die Teilnehmenden registrieren können.

    Erfolgsmessung & Nachfassen

    Nach dem Event ist es besonders wichtig, so schnell wie möglich bei den Personen, die für Sie interessant waren, nachzufassen und eine Beziehung aufzubauen. Wenn Sie einige Wochen verstreichen lassen, verlieren Sie Ihre Wunsch-Kandidat*innen.

    How To: Rekrutierungsevents (Messen, Dinner, Workshops)

    Erfahren Sie, wie Sie mit Rekrutierungsevents wie Messen, Dinner und Workshops die besten Mitarbeiter*innen rekrutieren können.

    Zuletzt aktualisiert:
    3.12.2025

    Die besten Ideen für ein Recruiting-Event

    Die gute Nachricht: Schon sehr einfache Events können Ihre potenziellen Bewerber*innen beeindrucken. Ihr Event muss nicht besonders aufwändig sein.
    Verknüpfen Sie ein Abendessen mit Lerninhalten.

  • Veranstalten Sie ein Abendessen auf einer Burg, wo Sie ihr Unternehmen vorstellen und Ihre Kolleg*innen gemeinsam mit den potenziellen Bewerber*innen essen. Das Ambiente wird allein schon für Gesprächsstoff sorgen.
  • Geben Sie einen Benimmkurs für Ihre zukünftigen Bewerber*innen und Ihre Mitarbeiter*innen. Dieser Kurs lässt sich optimal mit einem Abendessen verknüpfen, wo das Gelernte gleich angewendet werden kann.
  • Laden Sie zu einem Cocktail-Kurs ein.

  • Sie hatten oder haben ein echtes Problem? Veranstalten Sie doch einen Workshop, in dem Sie frische Ideen erhalten und den potenziellen neuen Mitarbeiter*innen beim Problem-Lösen zuschauen können.

  • Kreieren Sie eine Fallstudie. Das Erstellen ist zwar einmalig aufwendig, dafür können Sie sie aber auch immer wieder benutzen.
  • Veranstalten Sie einen Hackathon. Bei diesem zwei bis drei Tage dauernden Event müssen die potenziellen Bewerber*innen ein bestimmtes Problem lösen und ihre Lösung präsentieren. Der Bonus: Sie können jeden Fachbereich prüfen.

  • Von Messen als Rekrutierungswerkzeug möchte ich Ihnen abraten. Der Grund ist einfach, dass Sie dort aus einer Masse an attraktiven Konkurrenten hervorstechen müssen. Die Zielgruppe ist bei solchen Messen meist undefiniert und Azubi- oder Uni-Messen werden oft von Teilnehmer*innen besucht, die im Rahmen des Unterrichts hier sind, nicht auf freiwilliger Basis.

    Die Organisation eines Rekrutierungsevents

    Die Organisation Ihres Events will gut geplant sein. Nur dann kann es ein voller Erfolg werden. Hier ein paar Tipps:

  • Fangen Sie so früh wie möglich mit der Planung an.
  • legen Sie einen zeitlichen Fahrplan fest
  • legen Sie das Budget für Ihr Event fest
  • informieren Sie Ihre Mitarbeiter*innen, sodass diese sich vorbereiten und die Marketingtrommel rühren können.
  • erstellen Sie dazu am besten Kalendereinträge für Ihre Kolleg*innen
  • Entscheiden Sie sich für eine Eventart und den Ort.
  • achten Sie darauf, die richtige Zielgruppe anzusprechen
  • stellen Sie sicher, dass der Ort gut zu erreichen ist
  • wenn er nicht gut zu erreichen ist: stellen Sie die Logistik sicher
  • organisieren Sie Essen & Getränke, z. B. durch ein professionelles Catering oder durch die Location
  • überlegen Sie sich ein passendes Datum
  • denken Sie dabei bitte an Großveranstaltungen wie die EM, WM, Festivals, Wahlen und ähnliche
  • Vergessen Sie nicht, die Teilnehmer*innen am Tag des Events einzuchecken und willkommen zu heißen
  • Haben Sie Give-Aways? Diese sollten am besten zum Abschied verteilt werden
  • Maximale Teilnahme-Erfolgschancen durch das Anschreiben von fachspezifischen Gruppen

    “Das klingt ja alles wunderbar und woher bekomme ich jetzt die passenden Teilnehmer*innen für das Event her?”
    Dazu gibt es verschiedene Möglichkeiten. Wir empfehlen, genau dorthin zu gehen, wo Ihre Zielgruppe sich trifft. Diese fachspezifischen Gruppen können Online-Foren, Offline Meetups, Universitäten und eine Reihe weiterer Orte sein. Hier werden Sie sehr zielgenau die Menschen treffen, die Sie auf Ihrem Event sehen wollen. Und mit hoher Wahrscheinlichkeit werden sie auch zusagen. Wer sagt schließlich nein zu einer kostenlosen Fortbildung, Austausch mit Expert*innen aus dem eigenen Bereich und einem kostenlosen Essen?
    Weitere Teilnehmer*innen können Sie über Ihren Talentpool und über Werbekampagnen in sozialen Netzwerken ansprechen.
    Damit Sie die Teilnehmer*innen erfassen können, empfehlen wir, eine Software zu nutzen, in der sich die Teilnehmenden registrieren können.

    Erfolgsmessung & Nachfassen

    Nach dem Event ist es besonders wichtig, so schnell wie möglich bei den Personen, die für Sie interessant waren, nachzufassen und eine Beziehung aufzubauen. Wenn Sie einige Wochen verstreichen lassen, verlieren Sie Ihre Wunsch-Kandidat*innen.

    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.