Introducing the grid layout for pages in Kissflow Apps

We are excited to introduce Grid layout in Kissflow Apps—a more visual and intuitive way to design app interfaces. With drag-and-drop placement and alignment, the grid layout makes building clean, consistent layouts easier in less time.

Until now, the page builder has only supported the Flex layout, where you manually configure component sizes and positions through the Style tab. While flex offers precision for complex page designs, grid layout is ideal for simpler dashboards and quick builds, allowing you to resize and rearrange components directly on the canvas.

With this update, you can now choose between Grid and Flex layouts and switch between them anytime, depending on what best suits your workflow.

Key features

• The grid layout provides a row-and-column-based design experience. You can place components freely on the canvas without constraints, supporting highly customized layouts.

• You can use a single layout style for the entire page or combine both flex and grid layouts using containers, giving you greater precision and flexibility for more complex page designs.

• Components can be resized and rearranged directly with your mouse, offering precise control over height and spacing from the Style tab in both the layouts.

• For the grid layout, you can configure boundary space for each component using the Space around property to achieve better alignment and visual balance.

• The grid layout allows you to visually define maximum and minimum height limits for components using drag handles on the canvas, allowing them to auto-adjust within these boundaries.

What has changed

• In Flex, you can now resize components directly using the mouse, in addition to the existing option to configure sizes through the Style tab.

• The Column components section has been removed from the page builder. However, existing pages that use columns will continue functioning as usual without any issues.

What this means for you

The page builder now offers both Flex and Grid layouts. We are retaining flex as the default layout style, however, you can choose a single layout style for the entire page or use a combination of both styles—whichever suits your design needs and comfort level.

Try the new grid layout today and share your feedback in the comments below! To learn more, check out our help documentation.