Grids & Layouts
Botanic Layout
Organic bento grid with botanical themes and curved shapes.
bentobotanicorganiccurved
Props
Customize the component with these props
| Property | Type | Default | Description |
|---|---|---|---|
imageSrc | string | https://images.unsplash.com/photo-1518531933037-91b2f5f229cc?q=80&w=1527&auto=format&fit=crop | Main image source URL. |
imageAlt | string | Plants | Main image alt text. |
title | string | Monstera | Main card title text. |
description | string | Exploring the fractal patterns found in deep jungle flora. | Main card description text. |
label | string | Scientific Name | Top pill label text. |
value | string | Deliciosa | Top pill value text. |
bottomLeftText | string | Rare Species | Bottom left card text (supports for line breaks). |
percentage | string | 98% | Bottom right card percentage value. |
percentageLabel | string | Oxygen | Bottom right card label text. |
backgroundColor | string | #f4f7f2 | Background color (hex, rgb, or hsl). |
primaryColor | string | #1a3c28 | Primary color for main elements (hex, rgb, or hsl). |
secondaryColor | string | #dcead8 | Secondary color for accents (hex, rgb, or hsl). |
lightColor | string | #e6f0e9 | Light color for text overlays (hex, rgb, or hsl). |
textColor | string | #3a5a40 | Text color (hex, rgb, or hsl). |