awesome-repositories.com
博客
awesome-repositories.com

通过 AI 驱动的搜索,发现最优秀的开源仓库。

探索精选搜索开源替代品自托管软件博客网站地图
项目关于排名机制媒体报道MCP 服务器
法律隐私政策服务条款
© 2026 Bringes Technology SRL·VAT RO45896025·hello@awesome-repositories.com
·

34 个仓库

Awesome GitHub RepositoriesResponsive Layout Systems

Tools for creating adaptive web layouts that adjust to various screen sizes.

Distinguishing note: Focuses on the layout adaptation logic rather than general UI component styling.

Explore 34 awesome GitHub repositories matching web development · Responsive Layout Systems. Refine with filters or upvote what's useful.

Awesome Responsive Layout Systems GitHub Repositories

用 AI 发现最棒的仓库。我们将通过 AI 为您搜索最匹配的仓库。
  • h5bp/html5-boilerplateh5bp 的头像

    h5bp/html5-boilerplate

    57,494在 GitHub 上查看↗

    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

    Implements responsive layout systems using media queries to adapt the interface across different screen sizes.

    JavaScriptbest-practicescsshtml
    在 GitHub 上查看↗57,494
  • dogfalo/materializeDogfalo 的头像

    Dogfalo/materialize

    38,865在 GitHub 上查看↗

    Materialize is a Material Design CSS framework and component library. It provides a collection of reusable visual elements and styles used to build web page designs that follow the Material Design specification. The project includes a responsive web layout engine to create adaptive user interfaces. This system automatically adjusts structure and spacing based on screen size to ensure consistency across different devices. The framework covers frontend UI prototyping and general CSS integration, utilizing a grid system and pre-styled components to assemble functional website layouts.

    Ships an adaptive layout system that automatically adjusts spacing and structure for different screen sizes.

    JavaScriptcsscss-frameworkdesign
    在 GitHub 上查看↗38,865
  • alvarotrigo/fullpage.jsalvarotrigo 的头像

    alvarotrigo/fullPage.js

    35,437在 GitHub 上查看↗

    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

    Offers an adaptive layout system that adjusts scrolling behavior based on the user's screen size.

    JavaScriptfullpagefullscreenjavascript
    在 GitHub 上查看↗35,437
  • foundation/foundation-sitesfoundation 的头像

    foundation/foundation-sites

    29,778在 GitHub 上查看↗

    Foundation Sites is a responsive front-end framework providing a collection of CSS and JavaScript tools to build websites that automatically adapt to different screen sizes and devices. It functions as a responsive design library and cross-browser UI toolkit, offering a grid layout system and pre-styled interface components to ensure consistent rendering across modern web browsers. The framework enables rapid front-end UI prototyping and the integration of interactive components through a scripting interface that manages the lifecycle of UI plugins. It supports custom CSS framework management

    Offers a comprehensive system for creating user interfaces that automatically adapt to various screen sizes and devices.

    HTML
    在 GitHub 上查看↗29,778
  • heroui-inc/herouiheroui-inc 的头像

    heroui-inc/heroui

    29,684在 GitHub 上查看↗

    HeroUI is a declarative toolkit for building accessible user interfaces through modular, React-based component composition. It provides a comprehensive set of reusable building blocks designed to standardize visual language and interaction patterns across web and mobile applications. The library distinguishes itself through an integrated approach to accessibility and styling. It automatically manages state and keyboard interactions by injecting appropriate attributes, while utilizing a utility-driven styling architecture to enforce design system consistency. Developers can leverage polymorphi

    Creates fluid layouts that automatically adjust to different screen sizes and devices.

    MDXcomponent-librarycomponentslibrary
    在 GitHub 上查看↗29,684
  • qianguyihao/webqianguyihao 的头像

    qianguyihao/Web

    28,575在 GitHub 上查看↗

    This project is a front-end development knowledge base and technical learning roadmap. It serves as a structured collection of tutorials, detailed guides, and technical references designed to guide learners from basic syntax to advanced web engineering. The platform functions as a searchable repository of web development documentation, organizing technical knowledge into a curated sequence of lessons to help users transition into professional development. The site is built using static site generation and markdown-based content authoring. It includes a hierarchical category navigation system

    Provides an adaptive layout system ensuring educational content remains readable across desktop and mobile screen sizes.

    cssfront-endhtml
    在 GitHub 上查看↗28,575
  • kenwheeler/slickkenwheeler 的头像

    kenwheeler/slick

    28,573在 GitHub 上查看↗

    Slick is a JavaScript carousel library used to create responsive, touch-enabled sliding content areas. It functions as a frontend layout tool that allows for automated content rotation and the creation of lazy-loading image galleries. The library distinguishes itself through the ability to synchronize multiple sliders, ensuring that movement in one carousel automatically advances others to the same position. It supports adaptive breakpoints that adjust the number of visible slides based on screen size and utilizes lazy loading to defer image downloads until they enter the viewport. The syste

    Features an adaptive layout system that adjusts the number of visible slides based on screen size.

    JavaScript
    在 GitHub 上查看↗28,573
  • mdbootstrap/mdb-ui-kitmdbootstrap 的头像

    mdbootstrap/mdb-ui-kit

    24,256在 GitHub 上查看↗

    The mdb-ui-kit is a frontend component library and visual extension that combines the Bootstrap 5 framework with Material Design principles. It provides a collection of pre-styled interface elements and responsive web templates to facilitate the development of consistent web applications. The toolkit extends the Bootstrap ecosystem by adding Material Design aesthetics and advanced styling options. It enables rapid prototyping through the use of pre-configured design blocks and provides mechanisms for deep visual customization via SCSS variables and native CSS custom properties, including supp

    Includes a responsive layout system using media queries to adjust structures based on browser width.

    SCSSbootstrapbootstrap-materialbootstrap-template
    在 GitHub 上查看↗24,256
  • ruanyf/es6tutorialruanyf 的头像

    ruanyf/es6tutorial

    21,448在 GitHub 上查看↗

    This project is a comprehensive ECMAScript 6 tutorial and JavaScript language guide. It serves as a technical reference for learning the updated syntax and language features introduced in the ECMAScript 6 version of JavaScript. The resource focuses on modern JavaScript learning and syntax mastery, providing a structured set of tutorials to help developers align their skills with current industry standards and specifications.

    Provides a responsive layout that adapts educational content for readability across different screen sizes and devices.

    JavaScript
    在 GitHub 上查看↗21,448
  • zxwk1998/vue-admin-betterzxwk1998 的头像

    zxwk1998/vue-admin-better

    18,851在 GitHub 上查看↗

    vue-admin-better is a Vue 3 admin dashboard template and framework used for creating data-driven backend management systems. It provides a responsive admin UI kit with pre-built page templates and layouts that adapt to desktop, mobile, and tablet screens. The framework features a dynamic route management system that renders application navigation and page access based on configurations received from a remote server. It includes a mock API development environment for generating and exporting simulated backend data, enabling frontend development to proceed without a live API. The project imple

    Implements adaptive web layouts that adjust automatically to desktop, tablet, and mobile screen sizes.

    Vueadminadmin-dashboardadmin-template
    在 GitHub 上查看↗18,851
  • framework7io/framework7framework7io 的头像

    framework7io/framework7

    18,673在 GitHub 上查看↗

    Framework7 is a mobile user interface framework and single-page application system designed to build responsive web applications with native iOS and Android appearances. It provides a comprehensive library of pre-styled components and a layout engine to create native-style user interfaces across multiple platforms. The framework utilizes a platform-aware theming system that adapts visual styles and color schemes based on detected device settings. It incorporates native mobile behaviors through a dedicated UI kit, including specialized interaction patterns such as pull-to-refresh and swipeable

    Features a responsive layout engine with a grid and breakpoint system designed for various mobile screen sizes.

    JavaScriptandroidcomponentscordova
    在 GitHub 上查看↗18,673
  • uikit/uikituikit 的头像

    uikit/uikit

    18,534在 GitHub 上查看↗

    UIkit is a CSS front-end framework and accessible UI component library designed for building responsive web interfaces. It provides a comprehensive set of styling classes and modular components alongside a JavaScript interaction toolkit for managing behavioral elements. The framework includes native support for internationalized web interfaces, featuring multi-locale text translation and right-to-left layout directions. It employs a responsive layout engine that uses flexible grids, adaptive breakpoints, and container widths to align content across different screen sizes. The toolkit covers

    Employs a system for arranging content using flexible grids and adaptive breakpoints across various screen sizes.

    HTML
    在 GitHub 上查看↗18,534
  • bootstrap-vue/bootstrap-vuebootstrap-vue 的头像

    bootstrap-vue/bootstrap-vue

    14,450在 GitHub 上查看↗

    Bootstrap-vue is a Vue.js component library and responsive UI kit based on the Bootstrap CSS framework. It provides a frontend component suite of reusable interface elements designed for building mobile-first websites and web applications. The project wraps Bootstrap CSS classes in Vue components to manage styles and behaviors through reactive state. It integrates a responsive layout management system that synchronizes internal component states with Bootstrap's grid system and device breakpoints. The library covers a wide range of interface capabilities, including data display with sortable

    Implements a flexible grid system of containers, rows, and columns that adapt to different screen sizes.

    JavaScripta11yaccessibilityaccessible
    在 GitHub 上查看↗14,450
  • markmead/hyperuimarkmead 的头像

    markmead/hyperui

    12,137在 GitHub 上查看↗

    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

    Implements adaptive web layout systems that adjust fluidly to various screen sizes.

    HTMLaccessibilitycomponentscss
    在 GitHub 上查看↗12,137
  • cosmicmind/materialCosmicMind 的头像

    CosmicMind/Material

    11,988在 GitHub 上查看↗

    Material is a mobile user interface framework designed for building responsive and consistent native applications. It provides a declarative component architecture that allows developers to construct complex interfaces through modular, self-contained elements that manage their own state and rendering logic. The framework distinguishes itself through a constraint-based layout engine that calculates component geometry by solving spatial relationships between elements, ensuring layouts adapt automatically to varying screen sizes. It also features a hierarchical design system that propagates styl

    Provides constraint-based tools to arrange responsive layouts that adapt to varying screen sizes.

    Swiftanimationcardcosmicmind
    在 GitHub 上查看↗11,988
  • tachyons-css/tachyonstachyons-css 的头像

    tachyons-css/tachyons

    11,711在 GitHub 上查看↗

    Tachyons is a utility-first CSS framework and functional CSS library. It provides a collection of single-purpose classes used to style elements and build layouts without writing custom CSS. The framework centers on a mobile-first responsive design system and a nestable grid architecture that adapts layouts across different screen sizes. It includes accessible color palettes and schemes designed to meet visual contrast and accessibility standards. The system provides tools for utility-first styling, responsive layout management, and visual debugging to resolve alignment and spacing issues.

    Implements responsive layout systems that adapt interface structures across various screen sizes.

    CSScssdesigndesign-patterns
    在 GitHub 上查看↗11,711
  • vuematerial/vue-materialvuematerial 的头像

    vuematerial/vue-material

    9,837在 GitHub 上查看↗

    Vue Material is a comprehensive UI toolkit and framework for Vue.js that implements the Material Design specification. It provides a suite of pre-built, themed components designed to create consistent and responsive web applications. The library features dynamic theme support for runtime color scheme changes and automatic accessibility contrast management. It is designed for compatibility with server-side rendering to improve initial load times and search engine optimization, and it includes internationalization support for locale translation and text direction adjustments. The toolkit cover

    Provides responsive application shells and grid systems that adapt to different screen sizes.

    Vuehacktoberfesthacktoberfest2021javascript
    在 GitHub 上查看↗9,837
  • bartoszjarocki/cvBartoszJarocki 的头像

    BartoszJarocki/cv

    9,665在 GitHub 上查看↗

    这是一个配置驱动的简历构建器,用于生成极简风格的专业简历和个人作品集网站。它将单个结构化内容文件转换为静态 HTML 文档,将原始专业数据与展示层解耦。 该系统利用一组集中的全局 CSS 变量来管理颜色和布局模式,允许通过配置文件自定义视觉样式。 生成的 Web 布局是响应式且针对打印优化的,确保文档在数字屏幕和纸质介质上都能保持专业的格式。

    Employs a flexible system that adjusts the web layout for different screen sizes and print media.

    TypeScript
    在 GitHub 上查看↗9,665
  • thoughtbot/guidesthoughtbot 的头像

    thoughtbot/guides

    9,556在 GitHub 上查看↗

    This project is a software engineering style guide and a curated collection of architectural patterns and coding standards. It provides a multi-language coding standard to ensure maintainable software across Ruby, Python, JavaScript, and Swift. The project establishes a development workflow specification for version control, continuous integration, and peer review to maintain a linear project history. It also includes a web accessibility framework based on ARIA and WCAG standards, using design tokens and semantic HTML patterns to build inclusive interfaces. The guides cover a broad range of

    Implements adaptive interfaces using intrinsic layouts, container queries, and media queries.

    Ruby
    在 GitHub 上查看↗9,556
  • carbon-design-system/carboncarbon-design-system 的头像

    carbon-design-system/carbon

    9,172在 GitHub 上查看↗

    Carbon is an enterprise design system that provides a comprehensive collection of reusable UI components, design tokens, and guidelines for building professional web applications. It functions as a CSS framework that enforces a unified design language across projects through standardized typography, spacing, and color palettes. The system utilizes a platform-agnostic design token system to maintain visual consistency across different technologies. This includes centralized management of brand colors, motion easing curves, and a curated library of accessible SVG icons. The framework covers a

    Implements adaptive page structures that adjust based on screen size and spacing scales.

    TypeScript
    在 GitHub 上查看↗9,172
上一个12下一个
  1. Home
  2. Web Development
  3. Responsive Layout Systems