Hero (Classic)
The classic Hero is a page-level field (not inside the content array). It supports title, subtitle and an optional button. Variants: small (SM, default) or large (LG, home page only). Optional fields: image, highlighted, reverse. As a page-level type it also supports multiple slides (slides[]).
Card
The Card component is suited for thematically grouped content with an optional title, optional subtitle, image, body text and action buttons. Allowed body content types: paragraph, list, link, table.
Example card with image and buttons
Cards can contain text, lists and tables. One or more action buttons can be added via the buttons field.
Card with title and subtitle
Optional subtitle below the title
The subtitle field appears below the card's main title.
Image with Text (ImageSplit)
ImageSplit divides the content area into two halves: image and text. With reverse true the image appears on the right instead of the left. Additional optional variants: type TESTIMONIAL (circular image, centred layout – for quotes or person profiles), highlighted content (blue content area) or full-width (entire block blue), startPosition true (align content to top instead of centre), subtitle (optional subtitle field).
Image left, text right (default)
The ImageSplit component is well suited for product presentations, testimonials or thematic sections with visual support. An optional link button can be added below the text.
Image right, text left (reverse true)
With reverse true the image appears on the right side and the text on the left. Ideal for varied page layouts where multiple ImageSplit blocks appear one after another.
Map
Map embeds a Google Maps view for a location. The location value is passed as a search query to the Google Maps Embed API. Fields: location (required, bilingual).
Link Tiles
LinkTiles renders a group of clickable tiles, optionally with icons on the left/right and a colored background. With cols 2 the tiles appear in two columns (default: cols 1, single-column stack).
Grid with Topics
The Grid with topics renders icon links in a configurable grid (maxCols 1–4). Topics are simple navigation elements with an icon and label text.
Topic Overview (Grid Topics)
Grid with Blocks
The Grid with blocks renders clickable image tiles. With contentInsideBlock true the text overlays the image; with false it appears below.
Instruction Card
InstructionCards are suited for step-by-step instructions. They consist of an optional icon, optional title and an instruction text.
Step 1 – Fill in the online application
Fill in the online form and upload the required documents (payslip, ID copy) directly with the application.
Step 2 – Application is reviewed
Our team reviews your application and will typically get back to you within 1–2 business days.
Step 3 – Sign the contract
You receive the contract by post. After signing and the expiry of the 14-day statutory withdrawal period the amount is disbursed.
Grid with CardBlocks
The Grid with cardBlocks renders text tiles with an optional title (incl. icon and color options) and optional paragraph (incl. icon). Ideal for benefit or step overviews. Available titleIconColor values: black, green, blue. paragraphIconColor: black, green.
Fast processing
Response within 1–2 business days after submission of documents.
Flexible & customisable
Term and amount can be individually adjusted to your needs.
Fully online – no branch visit required.
Grid with Banners – BannerTable
The Grid with banners renders product cards with a 16:9 image header. BannerTable displays a price-comparison row table with alternating row backgrounds, optional badge (label) and a price footer. Icons: check_circle (green) or check_indeterminate_small (grey). Each banner requires either table or insurance.
Basic
Premium
Grid with Banners – BannerInsurance
The BannerInsurance variant shows insurance options with a title, description and structured benefit sections (optionSections), each with a title and bullet list.
CarProtect Basic
- Accident protection up to CHF 50,000
- Breakdown assistance 24/7
CardBlock – Multiple Paragraphs (1 column)
Using the paragraphs array, a CardBlock tile can contain multiple paragraphs each with an optional bold label and text below. Combined with maxCols 1, the automatically reduced gap renders tiles compactly stacked.
Why Cembra CyberProtect is worth it
Imagine:
You receive a text message, allegedly from a parcel service. You click on it because it looks urgent. Shortly afterwards, several hundred francs are debited from your credit card. A clear case of phishing.
With Cembra CyberProtect, financial losses up to CHF 5,000 are covered.
You order a new tablet online – and receive a damaged device. The retailer does not respond and the delivery service refuses to take responsibility.
CardBlock – Icon Rows (no side image)
Using the rows array, a CardBlock tile can display rows with a boxed icon, a bold label and an optional link. Ideal for step-by-step instructions.
How it works in the event of a claim
CardBlock – Icon Rows with Side Image
With sideImage and imagePosition right or left, an image appears beside the rows. Content takes flex-1, the image approximately one third of the tile width.
How it works in the event of a claim
Grid with Blue Background (background blue)
With background blue the entire grid block receives a blue background. Valid values for background: white, blue. Compatible with all grid content types (topics, blocks, cardBlocks, banners).
Benefit 1
Fast processing within 1–2 business days.
Benefit 2
Fully online – no branch visit required.
Benefit 3
Transparent terms without hidden costs.
Carousel with Heading
The optional heading field adds a title above the carousel. It contains only title (no type — the field is adapted for the Carousel context). All other Carousel fields still apply: highlighted, size (sm/md), cards.
Our Key Figures
Carousel – Image VCards
The third VCard variant in the Carousel uses an image (image.src + image.alt) and a text block. With href the tile renders as a link. Without href it appears as a non-clickable div. Fields: image.src, image.alt, text, href (optional).