For layout management, the strongest matches are gss/engine (This project is a constraint-based layout engine that computes), youngsoft/mylinearlayout (MyLinearLayout is an Objective-C UI layout framework for iOS) and react-grid-layout/react-grid-layout (React Grid Layout is a specialized layout management library). grommet/grommet and google/flexbox-layout round out the shortlist. Each is ranked by relevance to your query, popularity and recent activity.
Hand-picked CSS layout engines ranked by GitHub stars and activity. Compare top open-source tools and find the right one for your project.
This project is a CSS layout framework that functions as a responsive UI geometry solver. It replaces traditional static box model calculations with a constraint-based engine that determines element positions and dimensions by evaluating relational rules. The engine distinguishes itself by using a system of linear equations to resolve geometric conflicts, ensuring that all spatial constraints are satisfied simultaneously. It utilizes a shorthand visual syntax to define these relationships, allowing developers to describe complex alignment and spacing requirements through a declarative languag
This project is a constraint-based layout engine that computes UI element positions and dimensions through relational rules, making it a fitting choice for programmatic layout management despite lacking built-in window management features.
MyLinearLayout is an Objective-C UI layout framework and responsive layout engine for iOS. It serves as a multi-pattern view orchestrator that organizes interface elements using a combination of linear, relative, and grid layout patterns. The library brings CSS flexbox and floating element behavior to iOS views for dynamic space distribution. It includes a dedicated system for right-to-left language orientations, providing automatic mirroring of interface elements to support localized layouts. The framework covers a broad range of arrangement strategies, including flow-based element wrapping
MyLinearLayout is an Objective-C UI layout framework for iOS that provides flexbox, grid, and constraint-based layout management, though it is limited to mobile view arrangement rather than desktop window management or cross-platform usage.
React Grid Layout is a toolkit for building draggable, resizable, and responsive dashboard interfaces. It functions as a coordinate-based grid system that reconciles component positions and dimensions through declarative metadata, allowing developers to manage complex collections of UI elements that users can interact with directly. The library distinguishes itself through an automated packing algorithm that maintains structural integrity by shifting elements to fill gaps and resolving overlaps. It supports responsive design by monitoring container width changes against pre-defined breakpoint
React Grid Layout is a specialized layout management library for React that provides grid-based positioning, resizing, and responsive breakpoints for dashboard components, though it lacks general flexbox and window management.
Grommet is a React UI framework and accessible component library designed for building themed user interfaces. It provides a responsive design system and a themed interface toolkit to ensure inclusive user experiences across various screen sizes and device orientations. The framework emphasizes accessible UI development by providing pre-styled elements that follow web accessibility standards for screen readers and keyboard navigation. It enables the implementation of custom themes through a centralized system that manages visual styles and design tokens. The toolkit covers responsive web des
Grommet is a React UI framework and component library that provides responsive design and constraint-based layout features, fitting the visitor's need for UI arranging and positioning tools despite lacking standalone window management.
This is a layout library for Android applications that implements the CSS Flexible Box layout model. It provides a view container and engine that arrange child views by distributing space and aligning content according to a flexible box model. The framework enables the creation of responsive user interfaces that automatically adjust element positioning, wrapping, and growth based on available screen dimensions and orientations. The system includes capabilities for adaptive layout workflows, dynamic element alignment, and a virtualized rendering system for recycling views to display large dat
This library implements the CSS Flexbox model for Android UI layout, making it a fitting tool for flexible and responsive component positioning though it is limited to a single platform and missing grid or window management.
react-rnd is a JavaScript UI interaction library and React component used to create elements that are both draggable and resizable within a browser window. It functions as a constraint-based layout component that wraps DOM elements to enforce boundaries, grid snapping, and aspect ratio locks during manual adjustments. The library allows for the definition of custom interaction handles to act as the primary triggers for dragging and resizing actions. It supports axis restrictions, boundary limits, and the ability to round position and dimension values to specified pixel increments. The system
React-rnd is a constraint-based React component for making elements draggable and resizable within browser windows, which fits the UI layout management category well despite lacking flexbox, grid, and full window-management suites.
Rebass is a React design system library that provides a collection of theme-driven, responsive UI primitives. It functions as a theme-based layout engine, using a set of stateless components to standardize spacing, typography, and colors across a user interface. The library distinguishes itself by mapping style properties to a central design theme through a styled-system approach. This allows for responsive style mapping where components automatically adapt their appearance based on screen size and provides the ability to swap underlying HTML elements while preserving styling logic to maintai
Rebass is a React layout primitive library providing responsive style mapping and theme-driven grid and flexbox capabilities, making it a suitable tool for component-level UI layout even though it lacks standalone window management.
This project is a responsive layout framework for Angular that provides a system of directives to create adaptive user interfaces using CSS Flexbox and CSS Grid. It includes specialized libraries for managing flexible box alignment and structuring complex two-dimensional page grids. The framework features a breakpoint monitoring service to programmatically observe media query changes and trigger logic when viewport dimensions cross defined boundaries. To optimize performance, it includes a build-time CSS generator that uses SASS mixins to create static media query stylesheets, reducing the ne
This repository provides a responsive layout framework for Angular that implements both CSS Flexbox and CSS Grid capabilities for arranging user interface components, though its ecosystem relevance is tied specifically to the Angular framework rather than being a general-purpose layout library.
React Grid Layout is a draggable and resizable grid system for React that organizes components into a coordinate-based layout. It functions as a responsive layout manager and a serialized grid state engine, providing the tools necessary to create user-customizable workspaces where interface elements can be moved and resized. The system distinguishes itself through breakpoint-driven layout mapping, which adjusts grid configurations based on container width. It utilizes a serialized state model to convert spatial positions and dimensions into data formats for saving and restoring user layouts,
React Grid Layout is a responsive, draggable, and resizable grid component for React that lets you build customizable dashboards and workspaces, though it focuses specifically on grid-based UI layout rather than general window management or constraint-based layout engines.
tview is a library for building interactive text-based user interfaces in Go. It functions as a toolkit for managing event loops, user input, and screen rendering, providing a framework of pre-built widgets and an integrated layout engine for creating command-line applications. The project distinguishes itself through a comprehensive layout system that uses grid and flexbox models to create responsive designs. It also supports UI layer stacking to manage multiple screens and modal overlays. The framework includes a diverse suite of interactive components for data display, such as tables and
This Go library provides an integrated layout engine with flexbox and grid models for organizing text-based user interfaces, making it a strong fit if you are working within the terminal domain despite missing general window management.
FTXUI is a C++ terminal user interface library and cross-platform console framework used for building interactive command line applications. It functions as a declarative terminal layout engine and a component-based UI toolkit that enables the creation of responsive interfaces. The library is distinguished by its terminal graphics and animation capabilities, allowing for the rendering of custom shapes, data plots, and smooth visual transitions using easing functions. It provides a comprehensive set of interactive widgets and a layout system utilizing flexbox and grid containers that adapt to
FTXUI is a C++ terminal UI library that provides flexbox and grid layout containers along with component-based window management, making it a good fit for console-based layout needs.
vue-grid-layout is a draggable and resizable grid system for Vue.js that enables users to customize the placement and size of interface elements. It functions as a dynamic widget orchestrator and a state-persistent layout manager, allowing for the creation of customizable dashboard interfaces where components can be arranged and sized according to user preference. The system operates as a responsive dashboard framework that automatically adapts grid arrangements based on viewport size and supports right-to-left text directions. It provides the ability to capture and serialize grid positions a
It is a grid layout library for Vue.js that supports draggable and resizable elements for dashboards, though it is scoped to Vue rather than being a cross-platform framework for general window management.
AsyncDisplayKit is an asynchronous UI framework and performance library for iOS. It provides a collection of performant alternatives to standard views, allowing developers to build responsive interfaces by offloading layout and rendering tasks to background threads. The framework is centered around a declarative layout engine based on a flexbox model, which calculates element positions and sizes asynchronously. It utilizes a node-based abstraction to wrap native views, enabling the instantiation and configuration of UI hierarchies on background threads to prevent main thread blocking. The sy
AsyncDisplayKit is an iOS UI framework featuring an asynchronous flexbox layout engine that offloads sizing and positioning calculations to background threads, though it lacks general cross-platform window management.
Atomic Layout is a declarative framework for building responsive user interfaces in React. It functions as a layout engine that abstracts complex grid structures into reusable components, allowing for the creation of hierarchical spatial distributions without the need for manual media queries. The library distinguishes itself by mapping visual layout regions to component structures through dynamic grid-template-area generation. It utilizes a property-based system where components accept specific suffixes to automatically trigger responsive style adjustments based on viewport width. By employi
Atomic Layout is a React UI layout framework providing declarative grid layout engines and responsive styling, though it lacks general window management capabilities.
Packery is a JavaScript bin-packing grid layout engine and DOM element positioning library. It arranges elements of varying sizes into a gapless, compact grid by calculating and applying absolute coordinates to HTML elements to prevent overlapping. The library enables the creation of draggable grid interfaces, allowing users to rearrange elements via drag-and-drop while the system automatically reflows the remaining items. It maintains stable, responsive layouts across different screen dimensions by using a percentage-based positioning system and responding to window resize events. The tool
Packery is a JavaScript layout library focused on bin-packing and draggable grid arrangement, making it a good fit for specific UI layout and element positioning needs despite lacking a general flexbox system or window manager.
Nuklear is a portable, header-only immediate mode graphical user interface library written in C. It is designed to function as a lightweight framework for creating interfaces that render directly to hardware, making it suitable for integration into custom graphics engines, embedded systems, and resource-constrained environments. The library operates by generating abstract draw commands that are converted into vertex buffers, allowing for hardware-accelerated rendering through standard graphics APIs. By utilizing an immediate mode approach, the interface state is defined and updated within the
Nuklear is a portable, header-only immediate mode GUI library in C that includes built-in layout management and windowing capabilities, though it focuses on general UI creation rather than dedicated constraint or grid layout systems.
Opentui is a terminal user interface framework for building interactive command line applications. It provides a component-based system featuring a flexbox layout engine, a virtual node component tree, and a low-level 2D cell array renderer. The project is distinguished by a sophisticated keyboard binding engine that maps complex multi-stroke sequences and chords to named commands using prioritized, reactive layers. It also implements a plugin architecture that allows external modules to inject custom UI components into designated layout slots and extend input logic at runtime. Its capabilit
Opentui is a terminal user interface framework featuring a built-in flexbox layout engine for arranging and sizing components, though its window management and layout capabilities are strictly confined to the command line.
DearPyGui is a GPU-accelerated, immediate-mode graphical user interface framework for Python. It provides a high-performance toolkit for building interactive desktop applications by leveraging native hardware-accelerated rendering backends across multiple operating systems. By utilizing an immediate-mode execution model, the library offers direct control over the rendering loop and element state, enabling the creation of responsive, dynamic interfaces. The framework distinguishes itself through its ability to handle complex, high-frequency visual updates, making it suitable for real-time data
DearPyGui is a cross-platform immediate-mode GUI framework that provides flexible desktop window management and rendering, though its layout approach relies on custom positioning and containers rather than traditional CSS-style flexbox or constraint systems.
Iced is a cross-platform graphical user interface framework designed for building interactive applications with a focus on type safety and predictable state management. It utilizes a declarative architecture that separates application state, update logic, and view rendering, allowing developers to construct complex interfaces by nesting reusable functional components. The framework distinguishes itself through an Elm-inspired message-passing pattern, where all user interactions are processed as discrete messages to ensure reliable state transitions. It employs an immediate-mode rendering para
Iced is a cross-platform GUI framework providing declarative component architectures and layout engines for building structured user interfaces, making it a strong tool for UI layout management despite lacking an explicit CSS grid engine.
This project is an immediate-mode graphical user interface library designed for rapid development of tools and debugging interfaces. By generating UI geometry every frame through procedural code, it eliminates the need for persistent state synchronization between application data and the interface. It is primarily intended for integration into existing rendering pipelines, where it produces raw vertex buffers and draw commands that are agnostic to the underlying graphics API. The library distinguishes itself through a highly decoupled architecture that supports complex, dockable, and multi-vi
This immediate-mode graphical user interface library handles windowing, docking, and layout management, though it relies on procedural code rather than traditional constraint or flexbox models.
wpftoolkit is a UI component library and development toolset for building Windows desktop applications. It provides a collection of pre-built input controls, layout panels, and specialized components designed to extend standard interface capabilities. The project includes a data visualization toolkit for rendering complex datasets via charts, gauges, and three-dimensional views. It also features a window management framework for organizing application structures through docking layouts, wizard flows, and container controls, alongside a visual theme engine for managing the appearance of interf
This repository provides a window management framework with docking layouts and layout panels for WPF desktop applications, though it is tied to a specific UI platform rather than being a cross-platform general layout engine.
Golden Layout is a framework-agnostic UI container and web window layout manager designed to organize application interfaces into a flexible grid of draggable and resizable multi-pane windows. It functions as a hierarchical grid system that arranges page elements into a tree of nested rows and columns to create complex professional interfaces. The system acts as a multi-window workspace orchestrator, allowing components to be detached from the main layout into independent native browser windows. It also serves as a serializable layout engine that captures the arrangement of user interface com
Golden Layout is a framework-agnostic UI container and web window layout manager that organizes application interfaces into a flexible grid of draggable and resizable multi-pane windows, though it does not implement a full flexbox layout engine.
This library is a portable, header-only engine designed for calculating the geometric positions and dimensions of nested rectangular elements. It provides a recursive stacking-box model to determine interface coordinates, serving as a lightweight solution for two-dimensional layout calculations in C99 or C++ environments. The engine distinguishes itself through its focus on portability and resource efficiency. It utilizes a dependency-free memory abstraction that allows developers to override default allocation and assertion routines, making it suitable for specialized or restricted computing
This portable header-only library calculates UI geometry and stacking layouts in C, though it lacks window management and high-level grid features.
A declarative UI framework for iOS
This repository is a declarative UI framework for iOS that provides layout capabilities, making it a relevant tool for positioning elements though it is scoped to a specific platform rather than being fully cross-platform.
Dockview is a UI framework for building complex, desktop-like interfaces featuring dockable layout components, interactive tab grouping, and a cross-platform panel system. It provides the tools necessary to create environments with draggable tabs, split-views, and customizable panel arrangements. The system is distinguished by its multi-window layout manager, which allows panels to be detached into separate browser windows for multi-monitor setups. It further supports a state-persistent architecture that saves and restores the exact position and configuration of views across different user se
Dockview provides dockable layout components and split-views for building complex desktop-like interfaces, aligning well with UI layout management needs even though it specializes in docking and tiling rather than general flexbox or grid primitives.
| Dépôt | Stars | Langage | Licence | Dernier push |
|---|---|---|---|---|
| gss/engine | 2.9K | CoffeeScript | MIT | |
| youngsoft/mylinearlayout | 4.4K | Objective-C | MIT | |
| react-grid-layout/react-grid-layout | 22.3K | TypeScript | MIT | |
| grommet/grommet | 8.4K | JavaScript | Apache-2.0 | |
| google/flexbox-layout | 18.3K | Kotlin | Apache-2.0 | |
| bokuweb/react-rnd | 4.3K | TypeScript | mit | |
| rebassjs/rebass | 7.9K | JavaScript | MIT | |
| angular/flex-layout | 5.8K | TypeScript | MIT | |
| strml/react-grid-layout | 22.3K | TypeScript | MIT | |
| rivo/tview | 13.9K | Go | MIT |