Content Previews

Basic Banner with Image and Text

A cta banner basic component

CtaBannerBasic

API Reference

Prop	Default	Type
`headline`		`string`
`backgroundImage`		{ type: "image"; sources: { provider: string; src: string; width?: number ; height?: number \| undefined; responsive?: "static" \| "mobile" \| "desktop" \| undefined; focalPoint?: [number, number] \| undefined; }[]; alt?: string \| undefined; meta?: any; placeholder?: ["solid" \| "thumbhash", string] \| undefined; } \| { type: "video"; sources: { provider: string; src: string; width: number; height: number; length?: Duration \| undefined; format?: string \| undefined; responsive?: "static" \| "mobile" \| "desktop" \| undefined; }[]; alt?: string \| undefined; meta?: any; preview?: { type: "image"; sources: { provider: string; src: string; width?: number \| undefined; height?: number \| undefined; responsive?: "static" \| "mobile" \| "desktop" \| undefined; focalPoint?: [number, number] \| undefined; }[]; alt?: string \| undefined; meta?: any; placeholder?: ["solid" \| "thumbhash", string] \| undefined; } \| undefined; } \| undefined
`backgroundImageSizes`		`string`
`backgroundBrightness`		`BackgroundBrightness`
`overlay`		`ImageContrastOverlayProps`
`headlineColor`		`string`
`subline`		`string`
`caption`		`string`
`captionColor`		`string`
`backgroundColor`		`string`
`cta`		`CtaBannerButton`
`size`	`'m'`	`"s" \| "m" \| "l"`
`additionalHeight`		`"default" \| "small" \| "medium" \| "big"`
`alignment`	`'center left'`	`"center center" \| "center left"`
`mobileAlignment`	`'center center'`	`"top left" \| "top center" \| "bottom left" \| "bottom center" \| "center center" \| "center left"`
`mobileSizingMode`		`"aspect-ratio" \| "hug"`
`aspectRatio`		`string`

Banner Slider

Banners are components that deliver main image and content in various configurations.

Content with Image and Text

A section cms image text component