Grids & Layouts
Swiss Layout
Clean Swiss design bento grid with precise typography and minimal aesthetics.
bentoswissminimaltypography
Props
Customize the component with these props
| Property | Type | Default | Description |
|---|---|---|---|
headerTitle | string | HELVETICA | Header title text. |
headerYear | string | (1957) | Header year text. |
mainTitle | string | Objective Clarity | Main section title. |
mainDescription | string | The typeface was designed with a neutral disposition, having great clarity, no intrinsic meaning in its form, and could be used on a wide variety of signage. | Main section description. |
weightLabel | string | Weight | Weight selector label. |
weightOptions | string[] | ['Light', 'Regular', 'Bold'] | Array of weight option strings. |
styleLabel | string | Style | Style selector label. |
downloadText | string | Download | Download button text. |
bottomSquare1Text | string | Aa | Bottom left square text. |
bottomSquare2Text | string | R | Bottom right square text. |
bottomWideLabel | string | FIG. 04 — GRID SYSTEM | Bottom wide section label. |
backgroundColor | string | #f2f2f2 | Background color (hex, rgb, or hsl). |
accentColor | string | #ff3b30 | Accent color for highlights (hex, rgb, or hsl). |