Awesome GitHub RepositoriesElement Positioning

Sortable is a framework-agnostic JavaScript library for creating reorderable lists through drag and drop interactions. It functions as a reorderable list manager that allows users to rearrange DOM elements using pointer interactions on modern browsers and touch devices. The library enables the transfer or cloning of items between different lists using shared group identifiers. It supports complex organizational structures, including nested reorderable lists for managing hierarchical data across different levels. Its capabilities cover the animation of element movements and the configuration

CodeMirror 5 is a browser-based code editor and extensible UI component. It functions as a syntax highlighting engine and a programmable text surface, providing a professional coding experience embedded within web pages. The project is distinguished by its ability to act as a collaborative text editor, synchronizing document changes across multiple users in real time. It also includes a dedicated Vim emulation layer that implements modal keyboard interactions, motions, and operators. The system covers broad capability areas including language support for autocompletion and error analysis, co

react-virtualized is a library of components for rendering massive lists and tables by drawing only the elements visible in the viewport. It provides specialized layout managers including a windowed grid component and a dynamic height list manager. The project includes a masonry layout engine for packing items of varying heights and widths, as well as an infinite scroll interface for incrementally fetching and appending data. The library covers a broad range of virtualization capabilities, including frozen grid elements, reverse list rendering, and synchronized viewport scrolling. It also su

NativeScript is a cross-platform mobile development framework that enables the creation of native iOS and Android applications using JavaScript or TypeScript. It provides a direct bridge to native platform APIs, allowing developers to invoke native classes, methods, and properties directly from script code while maintaining full access to underlying mobile operating system features. The framework distinguishes itself through its direct native UI rendering, which maps declarative markup components to actual platform-native widgets rather than web-based views. This architecture is supported by

GSAP is a comprehensive JavaScript animation library designed for orchestrating complex motion sequences and interactive user interfaces. It provides a robust property-interpolation engine that calculates intermediate values for CSS styles, attributes, and numeric properties, enabling smooth visual transitions across web elements. The framework is built on a core architecture that manages animation lifecycles, timeline-based sequence orchestration, and virtual property interception to ensure precise control over motion. The library distinguishes itself through a modular, plugin-based extensib

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,

Dragula is a JavaScript drag and drop library and DOM element manipulator used to move and reorder HTML elements between multiple containers. It functions as a UI interaction framework and event manager that tracks drag lifecycles to facilitate the movement of elements within a web browser interface. The library distinguishes itself through configurable constraint validation, allowing developers to define which elements are draggable and which containers are permitted drop targets. It supports specialized interaction patterns such as element cloning, the use of specific drag handles to restri

Smartknob is an open-source programmable rotary interface platform that combines motor-driven feedback and sensor-based tracking to provide tactile input for digital environments. It functions as a customizable input device peripheral, utilizing a brushless motor and a magnetic encoder to translate physical rotation into precise control signals for software applications. The platform distinguishes itself through software-defined haptic feedback, which allows for the simulation of physical sensations such as clicks, springs, and hard stops. By employing closed-loop control and real-time motor

Vue.Draggable is a user interface component for Vue that enables drag-and-drop list reordering. It functions as a declarative wrapper for the Sortable.js library, providing a specialized list element that synchronizes the visual order of elements with an underlying data model. The project supports complex interactive layouts, including the ability to transfer items between multiple containers and clone items during the drag process. It provides mechanisms to restrict drag initiation to specific handle elements and allows for the embedding of static content within the draggable area. The fram

KaTeX is a typesetting library and web math renderer that transforms TeX and LaTeX mathematical notation into high-quality HTML and CSS for web browsers. It functions as a math notation parser and LaTeX to HTML converter, capable of operating as both a client-side library and a server-side math renderer to generate static HTML expressions. The project supports a wide range of specialized mathematical rendering, including chemical equation rendering, Bra-ket notation for quantum mechanics, and mathematical logic typesetting. It provides comprehensive controls for structural layouts such as mat

Skeleton is a lightweight responsive CSS boilerplate and mobile-first framework. It provides a foundation for building mobile-friendly websites through a fluid 12-column grid system, a minimal CSS reset library to normalize browser defaults, and default styling for raw HTML elements. The project emphasizes a mobile-first development approach, using percentage-based widths and predefined media queries to progressively enhance layouts for larger screens. It includes a utility-first library of single-purpose classes to manage common layout tasks such as floating elements, clearing, and width con

Yoga is a cross-platform layout engine and embeddable core that determines the dimensions and offsets of hierarchical element trees. It provides a C++ implementation of the Flexbox layout model to calculate element positions and sizes based on web standards, ensuring a uniform appearance across diverse devices and operating systems. The engine is designed for portability via a C API, allowing the layout logic to be integrated into various host languages and platforms. It utilizes an incremental layout system that identifies modified subtrees and recalculates positions only for changed nodes a

Draggable is a JavaScript library for implementing draggable elements and sortable lists within a web browser. It provides a functional toolset for creating accessible drag and drop interfaces and a mechanism for dynamically swapping, sorting, and reordering HTML elements in real time. The library features a cross-input interaction layer that unifies mouse, touch, and force-touch events into a single stream for consistent behavior across different devices. It specifically includes tools for providing screen reader feedback and assistive technology support to ensure drag operations are accessi

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

Masonry is a declarative UI layout engine and domain-specific language for defining layout constraints on iOS and macOS. It serves as a wrapper for native Apple layout constraints, providing a system for positioning views on a screen by declaring rules and priorities. The library implements a fluent interface that uses chainable method calls to define complex screen layouts. This approach replaces native configuration calls with an expressive syntax for generating layout rules. The engine includes capabilities for managing constraint priorities to resolve layout conflicts and tools for updat

Clay is a header-only layout engine designed for C and C++ applications that computes element positions and dimensions using a declarative box model. By operating as an immediate-mode framework, it calculates interface geometry dynamically on every frame, allowing for the creation of responsive and fluid user interfaces without maintaining persistent state. The library functions as a platform-agnostic tool that decouples layout logic from specific graphics backends. It provides a flexible coordinate system that supports layered elements, such as modals and tooltips, alongside standard documen

React-window is a frontend performance optimization library designed to render large datasets in React applications. It implements virtualization techniques to manage long lists and complex tabular data by dynamically mounting and unmounting elements based on the current viewport. By limiting the number of active document nodes, the library maintains interface responsiveness when handling thousands of data entries. The library distinguishes itself through a focus on efficient layout calculations and scroll-driven reconciliation. It uses absolute positioning and predefined dimensions to determ

Better-scroll is a JavaScript scroll library and touch interaction engine designed to create high-performance scrollable areas in web browsers. It functions as a modular UI component framework that provides the foundation for building complex scrollable elements. The library is distinguished by a plugin-based architecture that allows the injection of custom methods and event hooks. This system enables the creation of specialized interface components such as carousel sliders, scrollable picker inputs, and draggable element systems. The project covers a wide range of mobile web interaction pat

QuestPDF is a C# PDF generation library and layout engine used to create structured documents, reports, and invoices. It utilizes a fluent API and a component-based layout approach to convert code into high-fidelity PDF and XPS files. The library distinguishes itself with a dedicated layout debugger that provides real-time previews, hot-reload capabilities, and visual boundary tools to map rendered elements back to source code. It also functions as an accessibility tool, providing semantic tagging and navigational aids to ensure documents comply with international accessibility and archival s

Snap.svg is a JavaScript library for creating, manipulating, and animating scalable vector graphics directly in the web browser. It functions as a browser-based SVG generator and vector graphics manipulation tool, providing a framework to programmatically generate complex drawings and masks. The project serves as an animation engine for transitioning visual properties and attributes over time to create motion. It enables the development of dynamic SVG content, including the ability to animate viewboxes, matrices, and polygon points. Its capability surface covers geometric calculations and th