awesome-repositories.com
Blog
MCP
awesome-repositories.com

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

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

26 Repos

Awesome GitHub RepositoriesCSS Base Styles

Foundational style definitions that establish the default visual baseline for an application's user interface.

Explore 26 awesome GitHub repositories matching user interface & experience · CSS Base Styles. Refine with filters or upvote what's useful.

Awesome CSS Base Styles GitHub Repositories

Finde die besten Repos mit KI.Wir suchen mit KI nach den am besten passenden Repositories.
  • twbs/bootstrapAvatar von twbs

    twbs/bootstrap

    174,380Auf GitHub ansehen↗

    Bootstrap is a comprehensive, mobile-first CSS framework designed for building responsive web interfaces. It provides a standardized library of reusable UI components, such as navigation bars, modals, and forms, alongside a robust grid system that ensures consistent layout alignment across diverse viewport sizes. By establishing a baseline through browser normalization and standardized typography, the project enables developers to create accessible, cross-browser compatible web applications. The framework distinguishes itself through a modular Sass-based architecture that allows for deep cust

    Sets global box-sizing to border-box to ensure consistent element dimension calculations across all components.

    MDXbootstrapcsscss-framework
    Auf GitHub ansehen↗174,380
  • tailwindlabs/tailwindcssAvatar von tailwindlabs

    tailwindlabs/tailwindcss

    95,592Auf GitHub ansehen↗

    Utility-first CSS framework for fast, design-system-friendly styling.

    Normalize cross-browser inconsistencies and manage default element resets to establish a predictable foundation for custom design systems.

    TypeScriptcssframeworkutility
    Auf GitHub ansehen↗95,592
  • allthingssmitty/css-protipsAvatar von AllThingsSmitty

    AllThingsSmitty/css-protips

    30,114Auf GitHub ansehen↗

    This project is a curated knowledge base and technical reference for professional web styling. It serves as a comprehensive guide to modern CSS best practices, focusing on techniques that leverage native browser capabilities to create efficient, maintainable, and scalable stylesheets. The collection emphasizes the use of declarative style logic and modern layout engines to replace brittle, imperative approaches. By prioritizing native pseudo-class state management, logical property mapping, and relative unit scaling, the guide demonstrates how to build responsive interfaces that remain consis

    Configures global box-sizing and resets browser-specific margins to ensure consistent element sizing.

    awesomeawesome-listcss
    Auf GitHub ansehen↗30,114
  • unocss/unocssAvatar von unocss

    unocss/unocss

    18,854Auf GitHub ansehen↗

    UnoCSS is an atomic CSS engine and utility-first framework that generates styles on-demand based on the specific classes used in your source code. By scanning your project files during the build process, it produces only the CSS necessary for your application, effectively minimizing bundle size and eliminating unused styles. The engine distinguishes itself through a highly modular, configuration-driven architecture that allows for deep customization of design tokens, rules, and presets. It supports advanced styling patterns such as attribute-based styling, tag-based styling, and dynamic varia

    Applies hover styles conditionally based on device capabilities to prevent persistent hover states on touch screens.

    TypeScriptatomic-cssengineunocss
    Auf GitHub ansehen↗18,854
  • react/yogaAvatar von react

    react/yoga

    18,790Auf GitHub ansehen↗

    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

    Manages how element dimensions are calculated relative to padding and borders to ensure uniform spacing.

    C++
    Auf GitHub ansehen↗18,790
  • iissnan/hexo-theme-nextAvatar von iissnan

    iissnan/hexo-theme-next

    15,798Auf GitHub ansehen↗

    This project is a visual layout and styling package for the Hexo static site generator. It provides a static site template that converts Markdown files into a styled website, featuring a responsive interface with built-in support for internationalization and localized content display. The theme includes a specialized presentation layer for source code with syntax highlighting and customizable color schemes. It further enables the creation of professional portfolios by integrating social profile linking and external commenting platforms. The system organizes content through a taxonomy-based o

    Provides multiple visual schemes that users can apply to change the entire aesthetic of their static site.

    JavaScripthexohexo-themetheme-next
    Auf GitHub ansehen↗15,798
  • milligram/milligramAvatar von milligram

    milligram/milligram

    10,214Auf GitHub ansehen↗

    A minimalist CSS framework.

    Applies a minimal set of clean, responsive base styles so a page looks good without any custom CSS.

    HTMLampcsscss-framework
    Auf GitHub ansehen↗10,214
  • theme-next/hexo-theme-nextAvatar von theme-next

    theme-next/hexo-theme-next

    8,261Auf GitHub ansehen↗

    NexT is a responsive, elegant static blog theme for Hexo that generates HTML pages from Markdown posts. It is designed as a pre-built visual design for the Hexo framework, producing mobile-friendly layouts that adapt across devices with support for dark mode and multiple visual schemes. The theme distinguishes itself through extensive customization options, including five built-in code highlighting themes for technical blog posts and a multilingual interface supporting over 15 languages. It offers configuration flexibility by allowing theme settings to be stored either in the main Hexo config

    Offers multiple pre-built visual schemes switchable via configuration settings.

    Stylushexohexo-themetheme-next
    Auf GitHub ansehen↗8,261
  • formidablelabs/radiumAvatar von FormidableLabs

    FormidableLabs/radium

    7,346Auf GitHub ansehen↗

    Radium is a CSS-in-JS styling library that transforms static inline styles into dynamic, responsive, and animated CSS for React components. It functions as a component style toolchain and React inline style enhancer, allowing developers to define styles using plain JavaScript objects while gaining capabilities like browser state handling, vendor prefixing, and style composition. The library extends React's inline style system by automatically resolving browser state styles for hover, focus, and active interactions without manual event handlers. It supports inline media queries that evaluate a

    Processes style objects through a plugin-based pipeline for prefixing, media queries, and keyframe generation.

    JavaScript
    Auf GitHub ansehen↗7,346
  • sindresorhus/modern-normalizeAvatar von sindresorhus

    sindresorhus/modern-normalize

    7,348Auf GitHub ansehen↗

    modern-normalize is a CSS reset stylesheet and browser style normalizer. It provides a minimal set of global style overrides designed to remove inconsistent default user-agent styles and prevent browser-specific rendering quirks. The project establishes a predictable frontend layout baseline by standardizing typography and layout properties. It specifically enforces a consistent layout model by applying border-box sizing across all HTML elements. The stylesheet uses tag-based global targeting to apply normalization rules directly to HTML elements, removing the need for specific class names.

    Enforces a consistent layout model by setting the box-sizing property to border-box globally.

    TypeScript
    Auf GitHub ansehen↗7,348
  • adamschwartz/magic-of-cssAvatar von adamschwartz

    adamschwartz/magic-of-css

    6,684Auf GitHub ansehen↗

    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

    Switch between content-box and border-box to control whether padding and border are included in an element's total width and height.

    CSScssdesignexamples
    Auf GitHub ansehen↗6,684
  • tailwindlabs/tailwindcss-typographyAvatar von tailwindlabs

    tailwindlabs/tailwindcss-typography

    6,249Auf GitHub ansehen↗

    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

    Adds global base styles like typography defaults and font-face rules to the CSS output.

    JavaScript
    Auf GitHub ansehen↗6,249
  • mixn/carbon-now-cliAvatar von mixn

    mixn/carbon-now-cli

    6,024Auf GitHub ansehen↗

    carbon-now-cli ist ein Kommandozeilentool, das Quellcode in hochwertige Bilder rendert. Es dient als terminalbasierter Renderer und Bild-Exporter, der rohe Textdateien oder Eingabeströme in stilisierte visuelle Assets umwandelt. Das Tool konzentriert sich auf präzise Inhaltskontrolle und ermöglicht es Benutzern, exakte Zeilenbereiche für gezielte Code-Extraktion anzugeben. Es unterstützt Multi-Format-Exportoptionen, wodurch Bilder als Dateien gespeichert oder direkt in die Systemzwischenablage gesendet werden können. Die visuelle Anpassung wird über ein System von Styling-Presets verwaltet. Benutzer können benutzerdefinierte Farben, Schriftarten und Auflösungen über lokale Konfigurationsdateien definieren und speichern, um konsistente visuelle Stile über verschiedene Projekte hinweg beizubehalten.

    Implements a system to map JSON configuration presets to CSS properties for consistent visual output.

    TypeScriptclicli-appcli-application
    Auf GitHub ansehen↗6,024
  • basscss/basscssAvatar von basscss

    basscss/basscss

    5,892Auf GitHub ansehen↗

    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

    Provides utility classes for applying border-box sizing to individual elements.

    CSS
    Auf GitHub ansehen↗5,892
  • system-ui/theme-uiAvatar von system-ui

    system-ui/theme-ui

    5,405Auf GitHub ansehen↗

    Theme-ui ist ein React-Theme-Framework und CSS-in-JS-Utility für den Aufbau themenfähiger Benutzeroberflächen. Es fungiert als Design-System-Tool, das zentralisierte, einschränkungsbasierte Skalen für Farben, Typografie und Abstände festlegt, um visuelle Konsistenz über Anwendungen hinweg zu gewährleisten. Das Framework zeichnet sich durch eine Array-basierte responsive Kurzschreibweise für Mobile-First-Layouts und einen dedizierten Color-Mode-Manager aus, der mit Browsereinstellungen synchronisiert wird und Benutzerauswahlen beibehält. Es bietet zudem ein System zur Erstellung benannter Style-Varianten, um das Komponenten-Erscheinungsbild über Eigenschaften zu steuern, und bietet Synchronisationsfunktionen, um Theme-Konfigurationen in Figma-Styles zu übersetzen. Das Projekt deckt eine breite Palette an Styling-Funktionen ab, einschließlich globaler CSS-Injektion für Element-Resets, verschachtelter Theme-Overrides via Context und ein Deep-Merge-Konfigurationssystem zur Erweiterung von Design-Presets. Es enthält zudem eine Reihe themenfähiger Layout-Komponenten, wie responsive Grids und standardisierte Formulareingaben. Ein dediziertes Plugin ist für die Integration des Design-Systems in Gatsby-Sites verfügbar.

    Establishes foundational CSS base styles and resets to ensure a consistent visual baseline.

    TypeScriptcolordesigndesign-system
    Auf GitHub ansehen↗5,405
  • csstools/sanitize.cssAvatar von csstools

    csstools/sanitize.css

    5,293Auf GitHub ansehen↗

    sanitize.css is a CSS normalizer and reset library that provides a standardized baseline for typography, form controls, and element layouts. It removes browser default inconsistencies to establish a predictable foundation for web design and modern applications. The project implements a modern CSS baseline focusing on system interface fonts and consistent rendering across different web browsers and operating systems. It integrates a system-font stack to ensure consistent typography and fast rendering on various platforms. The stylesheet covers core layout and accessibility capabilities, inclu

    Standardizes the box-sizing property globally to ensure predictable element dimension calculations.

    CSS
    Auf GitHub ansehen↗5,293
  • jonathantneal/sanitize.cssAvatar von jonathantneal

    jonathantneal/sanitize.css

    5,293Auf GitHub ansehen↗

    sanitize.css is a CSS reset library and normalizer that provides a baseline stylesheet for web projects. It establishes a uniform visual starting point by removing inconsistent browser-specific default styles and implementing a global CSS reset. The project focuses on cross-browser style normalization, ensuring that typography, form controls, and HTML elements render consistently across different browsers and devices. It implements a system-font stack to eliminate rendering discrepancies and applies box-sizing normalization to ensure a predictable layout model. The library also includes acce

    Implements global box-sizing settings to ensure a predictable layout model across all elements.

    CSS
    Auf GitHub ansehen↗5,293
  • joshuaclayton/blueprint-cssAvatar von joshuaclayton

    joshuaclayton/blueprint-css

    5,286Auf GitHub ansehen↗

    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

    Provides foundational style definitions that establish the default visual baseline for the user interface.

    CSS
    Auf GitHub ansehen↗5,286
  • exacttarget/fueluxAvatar von ExactTarget

    ExactTarget/fuelux

    5,139Auf GitHub ansehen↗

    Fuelux ist ein JavaScript-UI-Framework und eine Frontend-Komponentenbibliothek für konsistente, einheitliche Benutzeroberflächen. Es bietet eine Sammlung leichtgewichtiger Controls und CSS-Erweiterungen, um visuelle und funktionale Konsistenz über verschiedene Web-Views hinweg zu gewährleisten. Das Projekt verwendet eine modulare Frontend-Architektur, die Funktionalität in unabhängige JavaScript-Control-Module organisiert. Dieses Design hält das Framework leichtgewichtig und erweiterbar, während es das funktionale Verhalten von visuellen CSS-Definitionen entkoppelt. Das Framework steuert die Interface-Entwicklung durch komponentenbasiertes State-Management und zustandsgesteuertes Rendering, wobei das Document Object Model direkt aktualisiert wird. Es nutzt ein System von Style-Erweiterungen, um standardisierte Themes und visuelle Präsentationen innerhalb der Anwendung bereitzustellen.

    Establishes a foundational visual baseline using a shared set of CSS style extensions.

    JavaScript
    Auf GitHub ansehen↗5,139
  • alexwolfe/buttonsAvatar von alexwolfe

    alexwolfe/Buttons

    5,001Auf GitHub ansehen↗

    Buttons is a CSS button framework and UI component library providing a set of reusable visual elements for mobile and desktop web environments. It functions as a CSS utility system and variable-driven theming engine that enables the creation of consistent buttons using configurable typography and shapes. The system utilizes a modular CSS architecture where independent style and color classes are composed on single elements to produce varied visual effects, such as 3D or flat designs. It employs a declarative design framework that maps configuration options to real-time visual attributes via c

    Centralizes visual properties in configuration files to drive the generation of consistent UI elements.

    JavaScript
    Auf GitHub ansehen↗5,001
Vorherige12Nächste
  1. Home
  2. User Interface & Experience
  3. Styling and Theming Systems
  4. CSS Base Styles

Unter-Tags erkunden

  • Base Style ManagementTools for managing browser normalization and resets.
  • Box Sizing ConfigurationsGlobal CSS settings that define how element dimensions are calculated relative to padding and borders.
  • Configuration-Based StylingMapping external configuration files to CSS properties for visual customization. **Distinct from CSS Base Styles:** Distinct from base styles by focusing on the mapping mechanism from JSON presets to CSS variables.
  • Plugin-Based Base Styles1 Sub-TagMechanisms for registering global base styles like typography defaults and font-face rules via a plugin system. **Distinct from CSS Base Styles:** Distinct from CSS Base Styles: focuses on the plugin-based registration mechanism for injecting base styles, not the styles themselves.
  • Pointer-Based Hover RestrictionsMechanisms for restricting hover-state styles to devices that support pointer-based interaction. **Distinct from CSS Base Styles:** Distinct from CSS Base Styles: focuses on conditional interaction logic rather than foundational visual baselines.
  • Responsive Base Styles1 Sub-TagApplies a minimal set of clean, responsive base styles so a page looks good without any custom CSS. **Distinct from CSS Base Styles:** Distinct from CSS Base Styles: adds responsive behavior to the base styles, ensuring pages look good without custom CSS.
  • Visual SchemesPredefined sets of CSS styles that change the overall appearance of a website without altering HTML structure. **Distinct from CSS Base Styles:** Focuses on swappable overall visual themes rather than just foundational baseline styles