Layout

Import

import { VKLayout } from "@vivakits/react-components";

Basic Usage

The Layout component provides a flexible container for organizing content with various configuration options.

Layout Orientation

The Layout component supports different orientation to suit various design requirements. It has horizontal and vertical orientation. By default the orientation is set to vertical.

Example 1

Example 2

Spacing

Customize the gap between layout items by passing the gap prop. We can pass sm, md, lg, xl. Besides we can also pass any number for specific gap size.

Examples

Examples 1

Examples 2

Examples 3

API Reference