Awesome GitHub RepositoriesCSS Base Styles

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

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

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

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

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

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

A minimalist CSS framework.

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

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

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.

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

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

carbon-now-cli es una herramienta de línea de comandos que renderiza código fuente en imágenes de alta calidad. Sirve como un renderizador basado en terminal y exportador de imágenes, convirtiendo archivos de texto crudos o flujos de entrada en activos visuales estilizados. La herramienta se centra en el control preciso del contenido, permitiendo a los usuarios especificar rangos de líneas exactos para la extracción de código dirigida. Admite opciones de exportación en múltiples formatos, permitiendo que las imágenes se guarden como archivos o se envíen directamente al portapapeles del sistema. La personalización visual se gestiona a través de un sistema de preajustes de estilo. Los usuarios pueden definir y guardar colores, fuentes y resoluciones personalizados mediante archivos de configuración locales para mantener estilos visuales consistentes en diferentes proyectos.

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

Theme-ui es un framework de temas de React y una utilidad CSS-in-JS utilizada para construir interfaces de usuario tematizables. Funciona como una herramienta de sistema de diseño que establece escalas centralizadas basadas en restricciones para colores, tipografía y espaciado para garantizar la consistencia visual en todas las aplicaciones. El framework se distingue por una abreviatura responsiva basada en arrays para diseños mobile-first y un gestor de modos de color dedicado que se sincroniza con las preferencias del navegador y persiste las selecciones del usuario. También cuenta con un sistema para crear variantes de estilo con nombre para controlar la apariencia de los componentes mediante propiedades y proporciona capacidades de sincronización para traducir configuraciones de temas a Figma Styles. El proyecto cubre un amplio conjunto de capacidades de estilo, incluyendo inyección global de CSS para reseteos de elementos, anulaciones de temas anidados mediante contexto y un sistema de configuración de fusión profunda (deep-merge) para extender preajustes de diseño. También incluye un conjunto de componentes de diseño tematizables, como rejillas responsivas y entradas de formulario estandarizadas. Hay un plugin dedicado disponible para integrar el sistema de diseño dentro de sitios Gatsby.

sanitize.css es una biblioteca de normalización y reset de CSS que proporciona una base estandarizada para tipografía, controles de formulario y diseños de elementos. Elimina las inconsistencias predeterminadas de los navegadores para establecer una base predecible para el diseño web y las aplicaciones modernas. El proyecto implementa una base de CSS moderna centrada en fuentes de interfaz del sistema y un renderizado consistente en diferentes navegadores web y sistemas operativos. Integra una pila de fuentes del sistema para garantizar una tipografía consistente y un renderizado rápido en varias plataformas. La hoja de estilos cubre capacidades fundamentales de diseño y accesibilidad, incluyendo la estandarización del modelo box-sizing y la eliminación de estilos específicos del sistema operativo en los inputs de formularios. Aplica restricciones responsivas a imágenes y videos para evitar el desbordamiento del diseño e incluye mecanismos para respetar las preferencias a nivel de sistema para reducir el movimiento.

sanitize.css es una biblioteca de reset de CSS y normalizador que proporciona una hoja de estilos base para proyectos web. Establece un punto de partida visual uniforme eliminando los estilos predeterminados inconsistentes de los navegadores e implementando un reset de CSS global. El proyecto se centra en la normalización de estilos entre navegadores, asegurando que la tipografía, los controles de formulario y los elementos HTML se rendericen de forma consistente en diferentes navegadores y dispositivos. Implementa una pila de fuentes del sistema (system-font stack) para eliminar discrepancias de renderizado y aplica la normalización de box-sizing para garantizar un modelo de diseño predecible. La biblioteca también incluye bases de accesibilidad, como el mapeo de roles de accesibilidad a cursores visuales y el respeto a las preferencias del sistema para reducir el movimiento. Además, gestiona los medios responsivos forzando a las imágenes y al contenido incrustado a permanecer dentro de sus contenedores principales.

Blueprint-css es un framework de CSS que proporciona un conjunto de estilos predefinidos y un sistema de rejilla (grid) responsivo para construir diseños de páginas web y tipografía consistentes. Incluye un reset de estilos de navegador para eliminar el estilo predeterminado del navegador, asegurando un punto de partida visual uniforme en diferentes entornos. El framework cuenta con un sistema de rejilla responsivo basado en columnas que adapta automáticamente el contenido web a varios tamaños de pantalla y dispositivos. También incluye una hoja de estilos de impresión dedicada para optimizar la apariencia del contenido web específicamente para la impresión física. El proyecto cubre la estandarización de la tipografía, el estilo de los inputs de formularios y la optimización de assets frontend. Se proporciona un script de compilación para minificar hojas de estilos y eliminar características no utilizadas para reducir el tamaño final del bundle de assets. Las herramientas de desarrollo incluyen un sistema de validación de diseño que delinea los elementos en el navegador para señalar declaraciones faltantes o uso incorrecto de clases.

Fuelux es un framework de UI en JavaScript y una librería de componentes frontend utilizada para construir interfaces de usuario consistentes y unificadas. Proporciona una colección de controles ligeros y extensiones CSS diseñadas para asegurar la consistencia visual y funcional en diferentes vistas web. El proyecto emplea una arquitectura frontend modular, organizando la funcionalidad en módulos de control de JavaScript independientes. Este diseño permite que el framework permanezca ligero y extensible mientras desacopla el comportamiento funcional de las definiciones visuales CSS. El framework maneja el desarrollo de interfaces mediante la gestión de estado basada en componentes y el renderizado dirigido por estado, actualizando el DOM directamente. Utiliza un sistema de extensiones de estilo para proporcionar temas estandarizados y presentación visual en toda la aplicación.

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