Awesome GitHub RepositoriesCSS Frameworks

This project is a utility-first component library that provides a comprehensive suite of pre-styled, reusable interface elements. It functions as a build-time engine that generates design-system-compliant styles by mapping semantic tokens to standard HTML elements and utility classes. By compiling all component styles into static CSS at build time, the library eliminates the need for client-side style calculation, ensuring efficient performance. The library distinguishes itself through a configuration-driven architecture that manages color palettes and visual styles, enabling dynamic switchin

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

Elysia is a high-performance TypeScript web framework designed for building type-safe backend services. It provides a modular, plugin-based architecture that allows developers to compose server logic, middleware, and validation schemas into scalable application instances. By leveraging native web standards, the framework ensures portability across diverse JavaScript runtimes, including Node.js, Deno, and various edge computing environments. The framework distinguishes itself through its focus on end-to-end type safety, automatically synchronizing request and response definitions between the s

This project is a CSS design system framework and modular library providing a standardized set of UI component stylesheets. It establishes a unified system of visual guidelines to ensure a consistent and professional look and feel across web interfaces. The framework is organized as a collection of standalone stylesheets that can be imported individually to minimize bundle size and eliminate unused styles. It utilizes a design token system based on CSS variables to manage theming and a utility-first class system for layout and spacing. The system employs a block element modifier naming conve

This project is a Sass implementation of the Bootstrap framework, providing a collection of responsive, mobile-first UI toolkits and layout systems. It serves as a Sass UI library that allows for the creation of custom CSS frameworks through the use of a preprocessor to generate browser-ready stylesheets. The framework is distinguished by its deep customization capabilities, enabling users to override default themes and visual variables using Sass variables and mixins. It utilizes a modular import system, allowing specific components to be selectively included to control the final CSS bundle

Bourbon is a CSS framework toolset and Sass mixin library designed to standardize styling patterns and reduce repetitive code in web projects. It serves as a workflow optimizer that provides a collection of reusable functions to streamline the process of writing and organizing stylesheets. The toolkit focuses on responsive web design by providing a library of mixins for implementing flexible layouts and standardized breakpoints across different screen sizes. It also includes a suite of command line utilities used to install and manage styling dependencies within a local development environmen

This project is a web development tutorial site and a Ruby on Rails learning resource designed as a beginner programming guide. It serves as a technical workshop curriculum and a structured framework for organizing and coaching community-led programming events. The site functions as a static site generator that converts Markdown content and templates into pre-rendered HTML pages. This architecture supports the delivery of step-by-step guides and instructional materials used to teach new learners how to build web applications. The content covers a broad range of capabilities, including Ruby o

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

Object-Oriented CSS (OOCSS) is a CSS methodology and framework that structures stylesheets around reusable, composable classes. Its core principle is separating layout and structure from visual design, allowing the same structural classes to work with different visual treatments. The approach encourages styling elements based on their own properties rather than their location in the DOM, making components portable across different contexts. The methodology is built on class composition, where complex visual patterns are created by combining multiple single-purpose CSS classes on a single elem

Blueprint-css est un framework CSS qui fournit un ensemble de styles prédéfinis et un système de grille responsive pour construire des mises en page web et une typographie cohérentes. Il inclut un reset de style de navigateur pour supprimer le style par défaut, assurant un point de départ visuel uniforme dans différents environnements. Le framework propose un système de grille responsive basé sur des colonnes qui adapte automatiquement le contenu web à travers diverses tailles d'écran et appareils. Il inclut également une feuille de style d'impression dédiée pour optimiser l'apparence du contenu web spécifiquement pour l'impression physique. Le projet couvre la standardisation de la typographie, le style des entrées de formulaire et l'optimisation des assets frontend. Un script de build est fourni pour minifier les feuilles de style et supprimer les fonctionnalités inutilisées afin de réduire la taille finale du bundle d'assets. Les outils de développement incluent un système de validation de mise en page qui souligne les éléments dans le navigateur pour signaler les déclarations manquantes ou l'utilisation incorrecte de classes.

django-crispy-forms is a Django form rendering library used to generate styled HTML output from forms. It employs a programmatic form layout engine that allows the composition of form structures and styling using Python objects rather than handwritten HTML templates. The library uses a template pack system to decouple form logic from visual styling, enabling the application of different CSS frameworks through configuration settings. This ensures frontend UI consistency by swapping the set of HTML templates used for various frameworks. The tool provides a Django template filter to produce com

Ce projet est un guide complet de développement front-end et une feuille de route conçue pour aider les ingénieurs à maîtriser les compétences et les normes professionnelles requises pour le développement web moderne. Il sert de référence technique pour maîtriser HTML, CSS et JavaScript, offrant des parcours d'apprentissage structurés et une carte des compétences professionnelles nécessaires pour passer de débutant à ingénieur web professionnel. La ressource fonctionne comme un répertoire catégorisé et un aperçu de l'écosystème JavaScript. Elle répertorie les frameworks, bibliothèques et utilitaires standards de l'industrie, offrant des recommandations spécifiques pour la gestion d'état, les frameworks CSS et les générateurs de sites statiques. Le guide couvre un large spectre de capacités d'ingénierie, incluant l'architecture UI, l'optimisation des performances web et l'audit d'accessibilité. Il fournit également des conseils sur l'automatisation des builds, les stratégies de déploiement et la sélection d'outils de développement pour les flux de travail professionnels.