Headers

Big - title + description + T-shape

Prominent full screen header. Shoud be used for the most important sites like the landingpage.

• widget name - Big title 1
• version - 0.0.1

Field	Required	Repeat	Type
Title	Y	-	string
Description	Y	-	text
Link	Y	Y	complex
- link label	Y	-	string
- link url	Y	-	url

Big - title + description + keyvisual

Prominent full screen header. Shoud be used for the most important sites like the landingpage.

• widget name - Big title 2
• version - 0.0.1

Field	Required	Repeat	Type
Title	Y	-	string
Description	Y	-	text
Image	Y	-	image
Link	Y	Y	complex
- link label	Y	-	string
- link url	Y	-	url

Big - title + description + cards

Prominent full screen header with animated cards to catch users attention. The right row is moving down and the left up. On mobile the bottom line

• widget name - Big title 3
• version - 0.0.1

Field	Required	Repeat	Type
Title	Y	-	string
Description	Y	-	text
Card	Y	Y	complex
- card row	Y	-	number
- card icon	Y	-	icon
- card title	Y	-	string
- card sub-title	Y	-	string
- card link	-	-	complex
--- card link label	-	-	string
--- card link url	-	-	url

Middle - title + description

Half screen header which allows the user to alredy see the content bellow but still has some more space for details in the header.

• widget name - Middle title
• version - 0.0.1

Field	Required	Repeat	Type
Title	Y	-	string
Description	Y	-	text

Short - title only

Short herader for pages where we want to put the main focus on the content below and that include a subnavigation.

• widget name - Short title
• version - 0.0.1

Field	Required	Repeat	Type
Title	Y	-	string

Short - with Search

Short herader with a search functionality.

• widget name - Short search
• version - 0.0.1

Field	Required	Repeat	Type

Subpages

Only simple color used in the background to

• widget name - Subpages
• version - 0.0.1

Field	Required	Repeat	Type
Title	Y	-	string
Description	Y	-	text
Link	Y	Y	complex

Subpage Contact

Only simple color used in the background to

• widget name - Subpages contact
• version - 0.0.1

Field	Required	Repeat	Type
Title	Y	-	string

Product page

With product image and text section on the left. On wider screens the image should stay at the same place like on this page: https://www.hubspot.com/

• widget name - Product page
• version - 0.0.1

Field	Required	Repeat	Type
Title	Y	-	string
Link	Y	Y	complex
Image	Y	-	image

Header with video in the background

With product image and text section on the left

• widget name - Header with video
• version - 0.0.1

Field	Required	Repeat	Type
Title	Y	-	string
Link	Y	Y	complex
Link	Y	Y	complex
Description	Y	-	text
Image	Y	-	image