awesome-repositories.com
Blog
awesome-repositories.com

Entdecke die besten Open-Source-Repositories mit KI-gestützter Suche.

EntdeckenKuratierte SuchenOpen-Source-AlternativenSelf-hosted SoftwareBlogSitemap
ProjektÜber unsRanking-MethodikPresseMCP-Server
RechtlichesDatenschutzAGB
© 2026 Bringes Technology SRL·VAT RO45896025·hello@awesome-repositories.com
·

80 Repos

Awesome GitHub RepositoriesResponsive Layout Adapters

Components that automatically adjust their dimensions based on changes to their parent container size.

Distinguishing note: Focuses on dynamic resizing behavior in response to container changes rather than static layout configuration.

Explore 80 awesome GitHub repositories matching user interface & experience · Responsive Layout Adapters. Refine with filters or upvote what's useful.

Awesome Responsive Layout Adapters GitHub Repositories

Finde die besten Repos mit KI.Wir suchen mit KI nach den am besten passenden Repositories.
  • h5bp/html5-boilerplateAvatar von h5bp

    h5bp/html5-boilerplate

    57,494Auf GitHub ansehen↗

    This project is a professional HTML5 website template and responsive web starter that provides a foundation of pre-configured HTML, CSS, and JavaScript files. It serves as a cross-browser compatibility base, ensuring consistent rendering and performance across modern web browsers. The project includes a web metadata framework to standardize Open Graph and social metadata for content previews on external platforms. It also provides a front-end build pipeline to lint, format, and optimize source assets into production-ready distribution files. The codebase covers broad capability areas includi

    Applies media queries and helper classes to adapt layouts across different screen sizes and devices.

    JavaScriptbest-practicescsshtml
    Auf GitHub ansehen↗57,494
  • alvarotrigo/fullpage.jsAvatar von alvarotrigo

    alvarotrigo/fullPage.js

    35,437Auf GitHub ansehen↗

    fullPage.js is a JavaScript full-screen scrolling library and layout engine used to create websites composed of vertical sections and horizontal slides that snap to the viewport. It provides a system for organizing web content into full-screen pages with automatic snapping behavior. The library distinguishes itself through a WebGL transition framework and visual storytelling tools, enabling cinematic effects such as 3D rotations, parallax backgrounds, fading, and water distortion during navigation. It also features a responsive adaptation system that can switch from automatic snapping to stan

    Adjusts scrolling behavior and transforms horizontal slides into vertical sections based on window dimensions.

    JavaScriptfullpagefullscreenjavascript
    Auf GitHub ansehen↗35,437
  • codepath/android_guidesAvatar von codepath

    codepath/android_guides

    28,339Auf GitHub ansehen↗

    This project provides a collection of instructional guides and tutorials for Android app development, native mobile application creation, and computer science education. It focuses on building native applications through step-by-step implementation, covering the development of user interfaces and the integration of system hardware and permissions. The material extends into broader technical domains, including the study of fundamental data structures and algorithms for technical interview preparation. It also covers cybersecurity fundamentals, such as identifying web vulnerabilities and implem

    Provides tutorials on creating user interfaces that adapt to different screen sizes and orientations.

    androidcodepathdevelopment
    Auf GitHub ansehen↗28,339
  • recharts/rechartsAvatar von recharts

    recharts/recharts

    27,241Auf GitHub ansehen↗

    This project is a declarative data visualization library that provides a composable suite of user interface components for rendering interactive charts. It functions as an SVG-based charting engine, allowing developers to construct complex visualizations by nesting modular building blocks such as axes, grids, legends, and data series within a unified layout. The library distinguishes itself through a highly responsive architecture that automatically reconciles layout changes and maps data domains to pixel coordinates using mathematical scale functions. It prioritizes performance through memoi

    Chart components adapt dynamically to parent container changes by enabling a responsive property that automatically adjusts chart dimensions.

    TypeScriptchartcharting-librarycomponents
    Auf GitHub ansehen↗27,241
  • bvaughn/react-virtualizedAvatar von bvaughn

    bvaughn/react-virtualized

    27,072Auf GitHub ansehen↗

    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

    Calculates parent container dimensions to dynamically adjust the size of internal virtualized elements.

    JavaScriptgridlistlistview
    Auf GitHub ansehen↗27,072
  • marmelab/react-adminAvatar von marmelab

    marmelab/react-admin

    26,780Auf GitHub ansehen↗

    React-admin is a framework for building data-driven administrative interfaces that connect to REST or GraphQL backends. It provides a comprehensive suite of tools for managing the full lifecycle of administrative applications, including resource-oriented routing, declarative form scaffolding, and context-driven state management. By utilizing a modular adapter-based architecture, the framework abstracts backend communication, allowing developers to build consistent CRUD interfaces that handle data fetching, authentication, and synchronization automatically. The project distinguishes itself thr

    Adjusts layouts and component behavior automatically for mobile and desktop devices to ensure a responsive user experience.

    TypeScriptadminadmin-dashboardadmin-on-rest
    Auf GitHub ansehen↗26,780
  • slint-ui/slintAvatar von slint-ui

    slint-ui/slint

    22,987Auf GitHub ansehen↗

    Slint is a declarative user interface framework designed for building native graphical applications across desktop, mobile, and embedded platforms. It utilizes a specialized markup language to define reactive interface components, which are then compiled into optimized machine code to ensure high performance and minimal resource consumption. By separating visual structure from application logic, the framework enables developers to create consistent interfaces that run efficiently on hardware ranging from resource-constrained microcontrollers to high-end desktop systems. The framework distingu

    Adapts component visibility and arrangement dynamically based on container dimensions for responsive design.

    Rustcppdeclarative-uidesktop
    Auf GitHub ansehen↗22,987
  • android/compose-samplesAvatar von android

    android/compose-samples

    22,893Auf GitHub ansehen↗

    Compose Samples is a collection of reference implementations for the Jetpack Compose UI library, serving as a practical guide for building native Android user interfaces. It demonstrates the use of a declarative framework where Kotlin functions describe layout structures and data dependencies, enabling developers to construct modern, reactive interfaces. The repository highlights architectural patterns that prioritize maintainability and testability, such as layered organization and unidirectional data flow. It showcases how to implement adaptive layouts that automatically adjust to various s

    Provides responsive layout components that automatically adjust to varying screen sizes and device form factors.

    Kotlinandroidjetpack-compose
    Auf GitHub ansehen↗22,893
  • flutter/samplesAvatar von flutter

    flutter/samples

    19,172Auf GitHub ansehen↗

    This is a comprehensive library of code examples and reference implementations for building cross-platform user interfaces with Flutter. The project provides a collection of demo applications and guides designed to illustrate the implementation of design patterns, animation techniques, and testing workflows. The repository features specific demonstrations for native integration, including examples of embedding modules into existing native applications, using platform channels, and bridging native code with the framework. It also serves as an animation reference, providing implementations for

    Implements layouts that adjust navigation and component placement based on screen width for mobile, desktop, and web.

    Dart
    Auf GitHub ansehen↗19,172
  • cocos2d/cocos2d-xAvatar von cocos2d

    cocos2d/cocos2d-x

    18,942Auf GitHub ansehen↗

    Cocos2d-x is a high-performance C++ game development framework designed for building and deploying interactive applications across mobile, desktop, and web platforms. It functions as a cross-platform game engine that utilizes an entity-component system to manage object lifecycles, behaviors, and spatial relationships within a unified codebase. The engine is distinguished by its specialized 2D graphics rendering pipeline, which is optimized for hardware-accelerated performance when displaying sprites, particle effects, and skeletal animations. It provides developers with low-level access to gr

    Provides flexible interface layouts that adapt to different screen sizes and resolutions.

    C++androidc-plus-pluscocos2d
    Auf GitHub ansehen↗18,942
  • google/flexbox-layoutAvatar von google

    google/flexbox-layout

    18,320Auf GitHub ansehen↗

    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

    Provides components that automatically adjust dimensions and layout direction based on the available device screen area.

    Kotlin
    Auf GitHub ansehen↗18,320
  • android/sunflowerAvatar von android

    android/sunflower

    17,774Auf GitHub ansehen↗

    Sunflower is a reference implementation designed to demonstrate modern Android development patterns and industry-standard architectural practices. It serves as a comprehensive guide for building functional mobile applications by integrating declarative user interface toolkits with robust data management and navigation systems. The project distinguishes itself by showcasing the transition from legacy view-based systems to modern declarative frameworks. It provides a practical example of how to organize code into distinct layers, manage complex state, and implement dependency injection to ensur

    Construct user interfaces that automatically adjust their arrangement to provide an optimal viewing experience across various screen sizes and device orientations.

    Kotlin
    Auf GitHub ansehen↗17,774
  • frappe/chartsAvatar von frappe

    frappe/charts

    15,088Auf GitHub ansehen↗

    This project is a client-side data visualization framework and SVG charting library used to render responsive, interactive charts in a web browser. It functions as a lightweight utility for generating scalable vector graphics and data annotations without external dependencies. The library enables the creation of custom SVG charts with adjustable colors and animations to meet specific design requirements. It supports dynamic data updates and the addition of markers, regions, and tooltips to provide context to specific data points. The system covers broad capability areas including responsive

    Creates SVG charts that automatically scale and adapt their layout to fit different screen sizes.

    JavaScriptchartgraphhacktoberfest
    Auf GitHub ansehen↗15,088
  • apexcharts/apexcharts.jsAvatar von apexcharts

    apexcharts/apexcharts.js

    15,096Auf GitHub ansehen↗

    ApexCharts is a comprehensive JavaScript charting library designed for building interactive, responsive, and data-driven visualizations within web applications. It functions as a versatile data visualization framework that supports a wide range of chart types, including categorical, statistical, and financial plots, enabling developers to construct complex dashboards and real-time monitoring interfaces. The library distinguishes itself through a deep commitment to accessibility and high-performance interactivity. It provides built-in support for keyboard navigation, screen readers, and high-c

    Calculates chart dimensions and axis scaling dynamically based on container size to ensure cross-device consistency.

    JavaScriptchartsdata-visualizationgraphs
    Auf GitHub ansehen↗15,096
  • faridsafi/react-native-gifted-chatAvatar von FaridSafi

    FaridSafi/react-native-gifted-chat

    14,426Auf GitHub ansehen↗

    This project is a cross-platform UI library for React Native designed to build messaging interfaces. It provides a comprehensive set of specialized components, including message bubbles, input toolbars, and layout containers, to facilitate the development of chat applications on iOS and Android. The library distinguishes itself through a highly flexible configuration interface that allows developers to override default elements and styling to meet specific branding requirements. It includes built-in support for complex interaction patterns such as swipe-to-reply gestures, quick-reply buttons,

    Optimizes layout and scroll positioning for consistent display across different screen sizes.

    TypeScriptchatcomponentreact-native
    Auf GitHub ansehen↗14,426
  • plouc/nivoAvatar von plouc

    plouc/nivo

    14,039Auf GitHub ansehen↗

    Nivo is a responsive charting framework and a React data visualization library that uses D3 for its underlying math logic. It serves as both a collection of interactive chart components for web applications and a server-side visualization engine for generating static data chart images. The project distinguishes itself by providing a containerized chart rendering API, allowing the visualization engine to be deployed via Docker to serve rendered graphics as images or files through a programmatic interface. It also features a motion engine for animated data transitions, ensuring smooth visual sh

    Automatically adjusts chart dimensions and layouts to fit different screen sizes and containers.

    TypeScriptcanvaschartscomponents
    Auf GitHub ansehen↗14,039
  • vector-im/element-webAvatar von vector-im

    vector-im/element-web

    13,219Auf GitHub ansehen↗

    Element Web is a web-based communication interface and collaboration platform built on the Matrix open standard. It functions as a client application for sending and receiving real-time messages and facilitating decentralized team communication. The project provides a cross-platform messaging interface that operates within web browsers and can be deployed as a standalone desktop application. It includes a multi-language user interface designed to support a global audience through localization.

    Employs a flexible layout system that automatically adjusts the chat interface for mobile and desktop viewports.

    TypeScript
    Auf GitHub ansehen↗13,219
  • puckeditor/puckAvatar von puckeditor

    puckeditor/puck

    12,813Auf GitHub ansehen↗

    Puck is a headless visual CMS and React visual page editor that provides a drag-and-drop interface for designing page layouts and managing content. It functions as a JSON-based content management system, storing page structures as JSON and exposing them via API for dynamic rendering within applications. The project enables dynamic route authoring by mapping visual editor instances to specific URL paths, allowing content editing for any page. It integrates a visual authoring layer into existing applications to facilitate the design of page structures using custom React components. The system

    Wraps the editing canvas in a resizable container to simulate different screen dimensions for responsive CSS testing.

    TypeScriptaibuilderdrag-and-drop
    Auf GitHub ansehen↗12,813
  • highcharts/highchartsAvatar von highcharts

    highcharts/highcharts

    12,463Auf GitHub ansehen↗

    Highcharts is a JavaScript charting library and interactive data visualization framework used to render complex datasets as visual charts and maps. It functions as a customizable SVG charting engine that produces scalable vector graphics for data series. The library allows for the creation of interactive data visualizations with configurable colors, labels, and themes. It also provides a cross-platform visualization wrapper to embed these web-based charts into native iOS and Android mobile applications. The toolkit supports the development of custom dashboards and provides options to build c

    Provides automatic redrawing and dimension recalculation of charts when the browser window or container size changes.

    TypeScript
    Auf GitHub ansehen↗12,463
  • markmead/hyperuiAvatar von markmead

    markmead/hyperui

    12,137Auf GitHub ansehen↗

    HyperUI is a dependency-free collection of responsive HTML layouts and pre-styled components designed for various web domains. It functions as a Tailwind CSS component library where users integrate standalone HTML snippets via a copy-paste distribution model to avoid package installation and framework overhead. The library features one-click markup copying from a pre-built component gallery. It includes specialized design systems, such as high-contrast neobrutalist styling with heavy borders, and visual tools for generating dark mode color palettes and harmonic typography scales. The compone

    Provides responsive container systems and fluid page layouts that adapt to various screen sizes.

    HTMLaccessibilitycomponentscss
    Auf GitHub ansehen↗12,137
Vorherige123…4Nächste
  1. Home
  2. User Interface & Experience
  3. Responsive Layout Adapters

Unter-Tags erkunden

  • Adaptive UI Layouts7 Sub-TagsInterfaces that adapt based on screen size and orientation using constraints and size classes. **Distinct from Responsive Layout Adapters:** Focuses on adapting to device screen dimensions and orientations rather than just parent container resizing.
  • Responsive Chart Layouts1 Sub-TagChart-specific layout logic that adapts to different screen sizes and device dimensions. **Distinct from Responsive Layout Adapters:** Specializes responsive adaptation for SVG charts specifically, rather than general container adapters.
  • Viewport SimulatorsContainers that simulate various screen dimensions to test responsive layouts. **Distinct from Responsive Layout Adapters:** Distinct from Responsive Layout Adapters: focuses on the simulation tool (the wrapper) rather than the components' resizing behavior.