DEMO-MODESave not possible
  • 100%
  • 75%
  • 50%
    Colors
    Global Colors
    • Accent Color
      Select the accent-color

    • Second Color
      Select the second-color

    Custom Colors
    • CustomColor1
      Select the CustomColor1

    • CustomColor2
      Select the CustomColor2

    Gradients
    • Gradient 1
      Select the first gradient
      Angle

    • Gradient 2
      Select the second gradient
      Angle

    Preset Colors
    • Background-Color: Lightgray
      Background-Color: Lightgray

    • Background-Color: Gray
      Background-Color: Gray

    • Background-Color: Darkgray
      Background-Color: Darkgray

    • Text-Color: Gray
      Text-Color: Gray

    Background Color
    • Background-Color
      Background-Color for body

    Body-Font
    Body-Font
    • Font-Family
      Font for body
      Beautify the Web
      Set

    • Font-Size
      Font-Size for body

    • Line-Height
      Line-Height in pixel for body

    • Font-Color
      Color for body

    • Word splitting: Off
      Hyphenation off
    Headlines
    Font-Family
    • Font-Family
      Font for all headlines
      Beautify the Web
      Set

    • Word splitting: Off
      Hyphenation off
    H1
    • Font-Family
      Font for h1
      Beautify the Web
      Set

    • Font-Size
      Font-Size for headline H1

    • Line-Height
      Font-Size for headline H1

    • Letter-Spacing
      Font-Size for headline H1

    • Color
      Color for headline

    H2
    • Font-Family
      Font for h2
      Beautify the Web
      Set

    • Font-Size
      Font-Size for headline H2

    • Line-Height
      Font-Size for headline H2

    • Letter-Spacing
      Font-Size for headline H2

    • Color
      Color for headline

    H3
    • Font-Family
      Font for h3
      Beautify the Web
      Set

    • Font-Size
      Font-Size for headline H3

    • Line-Height
      Font-Size for headline H3

    • Letter-Spacing
      Font-Size for headline H3

    • Color
      Color for headline

    H4
    • Font-Family
      Font for h4
      Beautify the Web
      Set

    • Font-Size
      Font-Size for headline H4

    • Line-Height
      Font-Size for headline H4

    • Letter-Spacing
      Font-Size for headline H4

    • Color
      Color for headline

    H5
    • Font-Family
      Font for h5
      Beautify the Web
      Set

    • Font-Size
      Font-Size for headline H5

    • Line-Height
      Font-Size for headline H5

    • Letter-Spacing
      Font-Size for headline H5

    • Color
      Color for headline

    H6
    • Font-Family
      Font for h6
      Beautify the Web
      Set

    • Font-Size
      Font-Size for headline H6

    • Line-Height
      Font-Size for headline H6

    • Letter-Spacing
      Font-Size for headline H6

    • Color
      Color for headline

    Text-Elements
    Paragraph: Default
    • Font-Size
      Font-Size for paragraph

    • Line-Height
      Line-Height in pixel for paragraph

    • Font-Color
      Color for paragraph

    Paragraph: Small
    • Font-Size
      Font-Size for paragraph

    • Line-Height
      Line-Height in pixel for paragraph

    • Font-Color
      Color for paragraph

    Paragraph: Medium
    • Font-Size
      Font-Size for paragraph

    • Line-Height
      Line-Height in pixel for paragraph

    • Font-Color
      Color for paragraph

    Paragraph: Large
    • Font-Size
      Font-Size for paragraph

    • Line-Height
      Line-Height in pixel for paragraph

    • Font-Color
      Color for paragraph

    Lists in Text
    • Style-Type: Style 1
      List-style-type: Style 1
    • Style-Type: Style 2
      List-style-type: Style 1
    • Style-Type: None
      List-style-type: None
    • Padding-Left
      Padding-left for list

    • List-Items: Margin
      Margin-Bottom between list-items

    CustomFont 1
    • Font-Family
      Font for customFont 1
      Beautify the Web
      Set

    • Font-Size
      Font-Size for customFont1

    • Line-Height
      Line-Height for customFont1

    • Letter-Spacing
      Letter-Spacing

    • Font-Color
      Color for text

    • Stroke-Color
      Color for outline

    • Stroke-Width
      Width for outline

    CustomFont 2
    • Font-Family
      Font for customFont 1
      Beautify the Web
      Set

    • Font-Size
      Font-Size for customFont1

    • Line-Height
      Line-Height for customFont1

    • Letter-Spacing
      Letter-Spacing

    • Font-Color
      Color for text

    • Stroke-Color
      Color for outline

    • Stroke-Width
      Width for outline

    List-Elements
    Style: Default
    • Style-Type: None
      List-style-type: None
    • List-Items: Margin
      Margin-Bottom between list-items

    • Padding-Left
      Padding-left for list

    • Font-Size
      Font-Size for list

    • Font-Weight
      Font-Weight for list

    • Line-Height
      Line-Height for list

    • Divider: Disable
      List-style-type: None
    Style: 2
    • Style-Type: None
      List-style-type: None
    • List-Items: Margin
      Margin-Bottom between list-items

    • Padding-Left
      Padding-left for list

    • Font-Size
      Font-Size for list

    • Font-Weight
      Font-Weight for list

    • Line-Height
      Line-Height for list

    Style: 3
    • Style-Type: None
      List-style-type: None
    • List-Items: Margin
      Margin-Bottom between list-items

    • Padding-Left
      Padding-left for list

    • Font-Size
      Font-Size for list

    • Font-Weight
      Font-Weight for list

    • Line-Height
      Line-Height for list

    • Divider: Disable
      List-style-type: None
    CustomStyle: 1
    • Style-Type: None
      List-style-type: None
    • List-Items: Margin
      Margin-Bottom between list-items

    • Padding-Left
      Padding-left for list

    • Font-Size
      Font-Size for list

    • Font-Weight
      Font-Weight for list

    • Line-Height
      Line-Height for list

    • Divider: Disable
      List-style-type: None
    CustomStyle: 2
    • Style-Type: None
      List-style-type: None
    • List-Items: Margin
      Margin-Bottom between list-items

    • Padding-Left
      Padding-left for list

    • Font-Size
      Font-Size for list

    • Font-Weight
      Font-Weight for list

    • Line-Height
      Line-Height for list

    • Divider: Disable
      List-style-type: None
    Topbar: Visibility
    Topbar
    • This header style hides the topbar on desktop and tablet. Choose a different header style to display it here.
    • Show on Desktop & Tablet
      Show the topbar on desktop and tablet. Mobile visibility is controlled separately.
    Items Desktop
    • Enable the topbar to preview these items.
    • Email
      Show Email in the topbar
    • Teaser
      Show Teaser in the topbar
    • Meta Navigation
      Show Meta Navigation in the topbar
    • Login
      Show Login in the topbar
    • Language Switcher
      Show Language Switcher in the topbar
    • Search
      Show Search in the topbar
    • Socials
      Show Socials in the topbar
    Topbar: Font
    Font
    • Font-Size
      Fontsize in topbar

    Topbar: Colors
    Colors
    • Font-Color
      Color for topbar text

    • Background-Color
      Background-color for topbar

    Topbar: Layout
    Size & Spacing
    • Vertical Padding
      Top and bottom inner spacing of the topbar, in pixels
      px

    • Top Margin
      Space above the topbar, in pixels
      px

    • Bottom Margin
      Space below the topbar, in pixels
      px

    • Side Margins
      Space on each side of the topbar, in pixels
      px

    Corners
    • Border Radius
      Topbar corner radius in pixels. Independent of Design Language > Corner Style.
      px

    Border & Shadow
    • Bottom Border Color
      Color of the 1px bottom border

    • Shadow Opacity
      Opacity of the topbar shadow, from 0 to 0.2

    Header: Visibility
    Visibility
    • Language Switcher
      Show the language switcher in the header
    • Search
      Show search in the header
    • Socials
      Show socials in the header. Not available for all header styles.
  • Visibility

    These settings are available in Desktop view.

    Classic v1
    • Turn on
      Turn this header style on
    • Position: Absolute
      overlays #slider section
    • Background-Color
      Background-Color for header

    • Border-Color
      Border-Color for header

    • Font-Color
      Font-Color for header

    Classic v2
    • Turn on
      Turn this header style on
    • Position: Absolute
      overlays #slider section
    • Background-Color
      Background-Color for header

    • Font-Color
      Font-Color for header

    Classic v3
    • Turn on
      Turn this header style on
    • Position: Absolute
      overlays #slider section
    • Background-Color
      Background-Color for header

    • Font-Color
      Font-Color for header

    Classic v4
    • Turn on
      Turn this header style on
    • Position: Absolute
      overlays #slider section
    • Background-Color
      Background-Color for header

    • Font-Color
      Font-Color for header

    Classic v5
    • Turn on
      Turn this header style on
    • Position: Absolute
      overlays #slider section
    • Background-Color
      Background-Color for header

    • Border-Color
      Border-Color for header

    • Font-Color
      Font-Color for header

    Classic v6
    • Turn on
      Turn this header style on
    • Position: Absolute
      overlays #slider section
    • Background-Color
      Background-Color for header

    • Border-Color
      Border-Color for header

    • Font-Color
      Font-Color for header

    Classic v7
    • Turn on
      Turn this header style on
    • Position: Absolute
      overlays #slider section
    • Background-Color
      Background-Color for header

    • Border-Color
      Border-Color for header

    • Font-Color
      Font-Color for header

    Classic v8
    • Turn on
      Turn this header style on
    • Background-Color
      Background-Color for header

    • Font-Color
      Font-Color for header

    Classic v9
    • Turn on
      Turn this header style on
    • Position: Absolute
      overlays #slider section
    • Background-Color
      Background-Color for header

    • Border-Color
      Border-Color for header

    • Font-Color
      Font-Color for header

    Classic v10
    • Turn on
      Turn this header style on
    • Position: Absolute
      overlays #slider section
    • Background-Color
      Background-Color for header

    • Border-Color
      Border-Color for header

    • Font-Color
      Font-Color for header

  • Header: Classic

    These settings are available in Desktop view.

    Modern v1
    • Turn on
      Turn on this header style
    • Position: Absolute
      overlays #slider section
    • Background-Color
      Background-Color for header

    • Border-Color
      Border-Color for header

    • Font-Color
      Font-Color for header

    Modern v2
    • Turn on
      Turn on this header style
    • Background-Color
      Background-Color for header

    • Font-Color
      Font-Color for header

    Modern v3
    • Turn on
      Turn on this header style
    • Background-Color
      Background-Color for header

    • Font-Color
      Font-Color for header

    Modern v4
    • Turn on
      Turn on this header style
    • Position: Absolute
      overlays #slider section
    • Background-Color
      Background-Color for header

    • Lines-Color
      Line Color

    • Font-Color
      Font-Color for header

    Modern v5
    • Turn on
      Turn on this header style
    • Background-Color
      Background-Color for header

    • Lines-Color
      Line Color

    • Font-Color
      Font-Color for header

    Modern v6
    • Turn on
      Turn on this header style
    • Background-Color
      Background-Color for header

    • Font-Color
      Font-Color for header

    Modern v7
    • Turn on
      Turn on this header style
    • Background-Color
      Background-Color for header

    • Font-Color
      Font-Color for header

    Modern v8
    • Turn on
      Turn on this header style
    • Background-Color
      Background-Color for header

    • Font-Color
      Font-Color for header

    Modern v9
    • Turn on
      Turn on this header style
    • Background-Color
      Background-Color for header

    • Font-Color
      Font-Color for header

    Modern v10
    • Turn on
      Turn this header style on
    • Position: Absolute
      overlays #slider section
    • Shadow: None
      Shadow: None
    • Background-Color
      Background-Color for header

    • Font-Color
      Font-Color for header

  • Header: Modern

    These settings are available in Desktop view.

    Minimal v1
    • Turn on
      Turn on this header style
    • Position: Absolute
      overlays #slider section
    • Background-Color
      Background-Color for header

    • Border-Color
      Border-Color for header

    • Font-Color
      Font-Color for header

    Minimal v2
    • Turn on
      Turn on this header style
    • Position: Absolute
      overlays #slider section
    • Background-Color
      Background-Color for header

    • Border-Color
      Border-Color for header

    • Font-Color
      Font-Color for header

  • Header: Minimal

    These settings are available in Desktop view.

    Leftside v1
    • Turn on
      Turn on this header style
      • Vertical Centered
        Centered Mainmenu
      • Background-Color
        Background-Color for header

      • Background-Image

        Uploads sind im Demo-Modus nicht verfügbar.

      • Lines-Color
        Line Color

      • Font-Color
        Font-Color for header

    Leftside v2
    • Turn on
      Turn on this header style
      • Vertical Centered
        Centered Mainmenu
      • Background-Color
        Background-Color for header

      • Background-Image

        Uploads sind im Demo-Modus nicht verfügbar.

      • Lines-Color
        Line Color

      • Font-Color
        Font-Color for header

    Leftside v3
    • Turn on
      Turn on this header style
      • Background-Color
        Background-Color for header

      • Background-Image

        Uploads sind im Demo-Modus nicht verfügbar.

      • Font-Color
        Font-Color for header

    Rightside
    • Turn on
      Turn on this header style
      • Vertical Centered
        Centered Mainmenu
      • Background-Color
        Background-Color for header

      • Background-Image

        Uploads sind im Demo-Modus nicht verfügbar.

      • Lines-Color
        Line Color

      • Font-Color
        Font-Color for header

  • Header: Beside

    These settings are available in Desktop view.

    Sticky Header
    Visibility
    • Hide: Stickyheader
      Display: none for stickyheader
    Font
    • Font-Size
      Font-Size in px

    Colors
    • Background-Color
      Background-color for sticky header

    • Glass-Effect
      Frosted glass look, the higher the value, the more of the page shines through

    • Text-Color
      Text color for sticky header

    • Active-Color
      Active color for stickyheader

    Highlight Class
    • Padding: Left | Right
      Padding Left | Right

    • Padding: Top | Bottom
      Padding Top | Bottom

    • Margin: Left
      Margin: Left

    • Margin: Right
      Margin: Right

  • Sticky Header

    These settings are available in Desktop view.

  • Mobile Header

    These settings are available in Mobile view.

    Sticky Header
  • Mobile Stickyheader

    These settings are available in Mobile view.

    Language Switcher
    Show in
    • Topbar
      Show Language Switcher in the topbar
    • Header
      Show the language switcher in the header
    Flags/Labels
    • Hide Flags
      Shows only country code
    • Hide Label
      Shows only the flag
    Font
    • Font-Family
      Font for the language switcher
      Beautify the Web
      Set

    • Font-size
      Font-size for the language switcher

    Design
    • Style 1
      Default language switcher
    • Style 2
      Transparent background with border
    • Style 3
      Transparent background without border
    Main Menu
    Fonts
    Colors
    Active Styles
    Highlight Class
    • Font-Size
      Font-Size

    • Font-Weight
      Font-Weight

    • Color
      Color for mainmenu

    • Background-Color
      Background-Color for mainmenu

    • Border: Color
      Border-Color for mainmenu

    • Border: Radius
      Border-Radius

    • Border: Width
      Border-Width

    • Padding: Left | Right
      Padding Left | Right

    • Padding: Top | Bottom
      Padding Top | Bottom

    • Margin: Left
      Margin: Left

    • Margin: Right
      Margin: Right

    Layout
  • Main Menu

    These settings are available in Desktop view.

  • Dropdowns

    These settings are available in Desktop view.

    Tablet Menu
    Fonts
    • Font-Family
      Font for Tabletmenu
      Beautify the Web
      Set

    • Font-size
      Font-size Tabletmenu

    • Line-Height
      Line-Height Tabletmenu

    • Uppercase
      Uppercase for Tabletmenu
    Colors
    • Glass-Effect
      Frosted glass look, the higher the value, the more of the page shines through

    • Background-Color
      Background-color for Tabletmenu

    • Color
      Color for Tabletmenu

    • Active-Color
      Color of the current page and its parents in the Tabletmenu

    • Trigger: Background
      Round background behind the submenu arrow

    Highlight Class
    • Font-Size
      Font-Size

    • Padding: Left | Right
      Padding Left | Right

    • Padding: Top | Bottom
      Padding Top | Bottom

    • Margin: Top
      Margin: Left

    • Margin: Bottom
      Margin: Right

    Layout
    • Use desktop menu instead
      Tablets show the desktop main menu instead of the tablet menu
  • Tablet Menu

    These settings are available in Desktop view.

    Mainmenu: Highlight Class
  • Mobile Menu

    These settings are available in Mobile view.

    Bottom: Layout
    Visibility
    • Show Bottom
      Show the bottom
    Size & Spacing
    • Vertical Padding
      Top and bottom padding inside the bottom in %
      %

    • Margin: Top / Bottom
      Adds Margins: Top | Bottom to Bottom in px
      px

    • Margin: Left / Right
      Adds Margins: Left | Right to Bottom in px
      px

    • Align: Center
      text-align: center
    Corners
    • Border Radius
      Corner radius for the bottom in px
      px

    Border
    • Border Top
      Top border color for the bottom

    Bottom: Font
    Font
    • Font-size
      Font-size for text

    Bottom: Colors
    Text-Colors
    • Color: Text
      Color for text

    • Color: Link-Hover
      Color for a:hover

    Background-Color
    • Background-color
      Background-color for bottom

    • Background-Image

      Uploads sind im Demo-Modus nicht verfügbar.

    • Backgroud-size: Cover
      background-size: cover
    • Backgroud-repeat: Repeat
      background-repeat: repeat
    Page Background
    Socials
    Show in
    • Topbar
      Show Socials in the topbar
    • Header
      Show socials in the header. Not available for all header styles.
    Boxed & Framed
    Boxed: Style 1
    • Boxed Style 1: ON
      Not for Header Beside
    • Page-Shadow
      Page-Shadow
    • Page-Width
      Width in pixel for page

    • Margin-Top
      Margin-top for page

    • Background-color
      Background-color

    Boxed: Style 2
    • Boxed Style 2: ON
      Not for Header Beside
    • Content-Width
      Width in pixel for content

    • Negative margin
      Negative margin for main

    • Background-color
      Background-color

    Boxed: Style 3
    • Boxed Style 3: ON
      Not for Header Beside

    • Background-color
      Background-color

    Boxed Background
    • Background-Image

      Uploads sind im Demo-Modus nicht verfügbar.

    • Repeat: none
      background-repeat: none
    • Repeat: repeat
      background-repeat: repeat
    • Repeat: repeat-x
      background-repeat: repeat-x
    • Repeat: repeat-y
      background-repeat: repeat-y
    • Position: center
      background-position: center
    • Backgroud-size: Cover
      background-size: cover
    • Attachment: fixed
      background-attachment: fixed
    • Background-color
      Outer background, visible when a Boxed or Framed layout is active.

  • Boxed & Framed

    These settings are available in Desktop view.

    Width & Spacing
    Spacing
    • Side Spacing
      Total horizontal spacing in percent, divided equally between the left and right sides

    • Article Vertical Spacing
      Default vertical spacing for articles with top or bottom spacing enabled

    Visibility
    • Hide Breadcrumbs
      Hide breadcrumb navigation on content pages