Grids & Layouts
Sketch Brutal Layout
Rough sketch-style bento grid with hand-drawn aesthetics.
bentosketchroughhand-drawn
Props
Customize the component with these props
| Property | Type | Default | Description |
|---|---|---|---|
heroTitle | string | ROUGH | Hero section title. |
heroSubtitle | string | DRAFT | Hero section subtitle. |
heroBadge | string | WIP | Hero section badge text. |
sideCard1Icon | React.ReactNode | First side card icon component (optional). | |
sideCard1Title | string | SKETCH | First side card title. |
sideCard2Icon | React.ReactNode | Second side card icon component (optional). | |
sideCard2Title | string | BRUTAL | Second side card title. |
bottomLeftQuote | string | Imperfection is beauty. | Bottom left section quote text. |
bottomLeftAvatars | number | 4 | Number of avatar images to display in bottom left. |
bottomRightText | string | WORK IN PROGRESS | Bottom right section text. |
backgroundColor | string | #f5f5f0 | Background color (hex, rgb, or hsl). |
heroColor | string | #ff6b6b | Hero section color (hex, rgb, or hsl). |
sideCard1Color | string | #4ecdc4 | First side card color (hex, rgb, or hsl). |
sideCard2Color | string | #ffe66d | Second side card color (hex, rgb, or hsl). |