30 open-source projects similar to angular/flex-layout, ranked by how many features they have in common. Compare stars, activity and what each one does to find the best Flex Layout alternative.
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
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
Neat is a Sass grid framework and responsive layout system used to build fluid, column-based web architectures. It provides a structured approach to managing layout properties and global design settings through a central configuration map and a toolset of Sass mixins and functions. The system is distinguished by its ability to handle nested grid architectures, allowing flexible grids to be placed inside other grid containers while maintaining precise alignment and gutter control. It also includes development tools for frontend layout debugging that render background guide lines to visualize c
This project is a cross-platform mobile development tutorial and educational guide. It provides a structured curriculum of lessons and code samples designed to teach users how to build mobile user interfaces using a JavaScript-based framework. The material focuses on several specialized areas, including a course on creating responsive interfaces with the flexbox layout model, guides on mobile component architecture for building reusable UI elements, and tutorials on integrating native code to access platform-specific APIs on iOS and Android. The curriculum covers a broad range of capabilitie
This project is a fixed-width CSS layout framework designed to organize web content into a standardized grid of columns and gutters. It provides a set of CSS rules and dimensions that ensure consistent page alignment and spacing across a frontend design grid. The system synchronizes visual design mockups with technical implementations using a 960 pixel width. It includes specialized style sheets that mirror grid alignment to support right-to-left language directions. The framework covers grid management through column implementation and layout spacing control. It further provides design inte
This project is a collection of reference guides and reusable patterns for implementing CSS layouts, typography, and visual effects. It serves as a library of style snippets and implementation guides for structuring web pages and creating common user interface patterns. The repository provides specialized galleries for visual effects and UI component patterns. These include techniques for creating glassmorphism, complex geometric shapes, and interactive elements such as accordions, tooltips, and animated tab indicators. The project covers a broad range of frontend capabilities, including res
Magic of CSS is a structured tutorial series that teaches web developers advanced CSS layout, typography, and animation techniques through hands-on examples. The course covers the full spectrum of CSS capabilities, from foundational box model and positioning concepts to sophisticated animation and interactive state management, all without relying on JavaScript. The series distinguishes itself by teaching practical, real-world CSS patterns such as inline-block justified grids, percentage-based absolute positioning, table-display vertical centering, and letter-span styling techniques. It demons
Vizro is a low-code Python framework for building production-ready data visualization applications. It functions as a UI orchestrator that allows users to define multi-page analytical dashboards through structured configurations in Python, YAML, or JSON, reducing the need for extensive frontend engineering. The project distinguishes itself through generative AI integration, utilizing a model context protocol server to translate natural language descriptions into validated dashboard configurations, charts, and layouts. It also features a decoupled data cataloging system that separates data sou
vanilla-extract is a type-safe CSS-in-JS library and zero-runtime CSS framework. It uses TypeScript to define styles and design tokens, compiling these definitions into static CSS files during the build process to eliminate styling overhead in the browser. The system acts as a scoped CSS generator, producing unique class names and local variables to prevent global style leakage and naming collisions. It provides a type-safe styling tool that validates CSS property values and ensures design tokens adhere to defined themes during development. The framework covers comprehensive styling utilitie
Critical is a tool for extracting and inlining the minimum CSS required to render above-the-fold content. It identifies the styles necessary for the initial visible portion of a page to reduce render-blocking requests and improve page load speed. The project generates resolution-specific stylesheets to optimize the initial paint across different device dimensions. It includes a utility to rebase asset URLs within extracted styles, ensuring that images and fonts load correctly when stylesheets are moved to different directories or content delivery networks. The tool provides a command-line in
This project is a cross-platform user interface framework that maps mobile-native component primitives to standard web elements. It enables developers to build consistent applications that function across both mobile and web environments by providing a unified library of components and shared logic. The framework distinguishes itself through a specialized style engine that converts JavaScript object-based declarations into optimized, scoped CSS at runtime. It also features a responsive layout engine that implements a flexbox-based system, ensuring that interfaces adapt dynamically to differen
Blueprint-css is a CSS framework that provides a set of predefined styles and a responsive grid system for building consistent web page layouts and typography. It includes a browser style reset to remove default browser styling, ensuring a uniform visual starting point across different environments. The framework features a column-based responsive grid system that automatically adapts web content across various screen sizes and devices. It also includes a dedicated print stylesheet to optimize the appearance of web content specifically for physical printing. The project covers typography sta
toolong is a terminal log viewer and TUI log manager designed for monitoring live log streams and navigating large log files. It functions as a log aggregator and JSONL formatter, capable of merging multiple log files into a single chronological view by automatically detecting timestamps. The application supports the visualization of structured data by pretty printing JSONL files and applying syntax highlighting to common web server log patterns. It handles large-scale data efficiently through virtual-sized scrollable views, allowing users to open compressed logs or files of any size without
charts.css is a CSS-driven framework designed to transform semantic HTML into accessible data visualizations without relying on JavaScript. It functions as a charting library that uses standard HTML structures, such as tables and lists, to render graphs while maintaining full compatibility with screen readers. The project distinguishes itself by using CSS variables to map numeric data to visual dimensions and utility classes to control chart types and layouts. It supports a wide range of visual styles, including 3D effects, reflection effects, and customized color palettes integrated via a br
Gutenberg is a CSS print formatting framework and web-to-PDF layout engine. It provides a system for managing stylesheets, element visibility, and structural layout rules to ensure web content maintains a consistent visual structure when converted to physical documents or PDF files. The project manages print-specific rendering through a stylesheet manager that filters out non-essential interface elements and prevents the automatic expansion of URLs. It includes utilities to enforce the rendering of background colors and images, which browsers typically strip during the printing process. The
MvvmCross is a .NET MVVM framework designed for building cross-platform applications by separating business logic from native user interfaces. It functions as a navigation engine and a UI data binding library, enabling the encapsulation of logic within view models that are reused across different operating systems. The framework provides a native hardware abstraction layer and a dependency injection container to decouple components and provide a consistent interface for accessing device features. It coordinates type-safe transitions between native screens and manages the synchronization of da
Print.js is a JavaScript print library that provides a client-side interface for triggering system print dialogs and formatting HTML content for physical paper output from a web browser. It functions as a browser print controller that manages the lifecycle of temporary print documents to ensure consistent rendering. The library utilizes a DOM-to-frame printing utility that clones specific HTML elements into hidden iframes. This process isolates printable content from the main page layout, allowing the system to render a clean document without triggering a full page reload. The tool covers br
Tailwind CSS Typography is a plugin for the Tailwind CSS framework that provides hand-tuned typographic defaults for blocks of vanilla HTML content, such as content from Markdown or a CMS. It applies beautiful prose styles to HTML content using a single class, eliminating the need for custom CSS to style rich text. The plugin distinguishes itself by offering deep customization and control over typography. Users can adjust the overall font size of prose content across five predefined sizes, select from five built-in gray-scale palettes to match a project's color scheme, and seamlessly adapt ty
This project is a collection of responsive CSS Grid dashboard templates and a data visualization UI kit. It provides a set of HTML layouts designed for building analytics interfaces and monitoring views for KPIs and business metrics that adapt to different screen sizes. The toolkit is library-agnostic, allowing the connection of static HTML templates to any external data source or third-party charting library without requiring custom adapter code. It uses a template-driven approach to separate the visual structure of the dashboard from the underlying data. The capabilities cover the assembly
Flexibility is a JavaScript layout engine and CSS compatibility layer that functions as a polyfill for the CSS Flexbox specification. It simulates flexible box layout behavior in web browsers that do not natively support the specification. The project achieves cross-browser layout consistency by implementing a programmatic system to calculate and apply alignment, direction, and wrapping properties to DOM elements. It provides utilities for both the application and extraction of these layout styles to manage the visual structure of a page. The engine operates through DOM tree traversal and ma
Lost is a CSS grid system and PostCSS plugin designed to define column widths and positions using mathematical calculations for responsive screen designs. It functions as a build-time tool that processes custom grid rules into browser-compatible CSS layouts. The framework transforms non-standard layout declarations into native CSS Grid and Flexbox properties. It uses a PostCSS-based pipeline to calculate exact coordinates and column widths, ensuring that the resulting styles are compatible with standard web browsers. The project operates as a preprocessor-agnostic middleware layer, allowing
This project is an advanced CSS learning curriculum consisting of starter files and final projects. It provides a collection of real-world implementations and a project gallery designed for mastering modern layout and styling techniques. The curriculum focuses on a modular approach to stylesheets using Sass variables and architecture. It emphasizes the block-element-modifier naming convention to create maintainable and reusable CSS. The material covers several core capability areas, including responsive web design using CSS Grid, Flexbox, and media queries. It also includes the development o
Flexibility is a JavaScript library and layout engine designed to polyfill CSS Flexbox capabilities. It ensures consistent element alignment and distribution across different browser versions, specifically targeting legacy environments that lack native support for the flexible box specification. The project provides cross-browser layout compatibility by simulating flexible container behavior. It manages dynamic flexbox properties to maintain a stable and predictable user interface regardless of the visitor's browser version. The system covers DOM traversal, manual coordinate calculation, and
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
Basscss is a lightweight CSS utility toolkit built on an atomic, single-purpose class architecture. Each class performs exactly one visual function, enabling immutable, side-effect-free styling where no class ever overrides or conflicts with another. The system provides a predefined spacing scale, responsive breakpoint prefixes for conditional styling across device widths, and accessible visibility control that keeps content programmatically available to assistive technologies. The framework distinguishes itself through a float-based grid system that constructs layouts using floated percentag
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
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
Tamagui is a cross-platform user interface framework designed to build high-performance, themeable applications that share logic and styling across web and mobile environments. It functions as a comprehensive design system orchestrator, providing a collection of type-safe components that compile to optimized atomic CSS for the web and native code for mobile platforms. By utilizing a build-time compiler, the framework eliminates runtime overhead, ensuring consistent visual output and interaction behavior regardless of the target platform. The framework distinguishes itself through its advanced
Mantine is a comprehensive component library for building accessible and responsive web applications. It provides a foundational set of UI elements and layout primitives, anchored by a base component that supports consistent styling, spacing, and layout properties across the entire interface. The library is built on a design-driven theme engine that uses a provider-based system to propagate global design tokens and color schemes throughout an application. The library distinguishes itself through a robust architecture that emphasizes component composition and reusable interaction logic. It uti
This project is a minimalist visual theme and customizable CSS framework for Obsidian. It functions as a markdown layout engine and an adaptive user interface designed to remove interface clutter and create a distraction-free writing environment. The theme distinguishes itself through layout transformations that convert standard markdown tables and lists into card-based grids and visual galleries. It provides a system for transforming structured data into scannable visual representations and organizes consecutive images into column-based grids. The framework covers comprehensive interface ae