Pigment Css

Pigment CSS es una herramienta de estilo agnóstica al framework que mueve el procesamiento de estilos de los componentes desde el runtime del navegador a la fase de build. Al analizar el código fuente de los componentes y las configuraciones de temas durante la compilación, genera archivos CSS independientes y optimizados, eliminando efectivamente la necesidad de calcular estilos en tiempo de ejecución.

La biblioteca proporciona un sistema para gestionar tokens de diseño, como colores y espaciado, transformándolos en variables CSS nativas. Este enfoque permite un estilo dinámico y lógica consciente del tema sin requerir un motor basado en JavaScript. También admite la encapsulación de estilos basada en componentes, permitiendo a los desarrolladores definir estilos reutilizables y lógica basada en variantes que permanecen aisladas y mantenibles.

Más allá del estilo central, la herramienta incluye soporte automatizado para interfaces de usuario internacionalizadas generando reglas CSS bidireccionales para diseños de derecha a izquierda. También ofrece capacidades para definir estilos globales, crear keyframes de animación reutilizables y exponer slots de componentes para anulaciones basadas en temas. El framework se integra en entornos web modernos extrayendo estilos colocados en activos estáticos durante el proceso de build.

Features

CSS-in-JS Compilers - Provides a zero-runtime styling framework that compiles component-level CSS-in-JS definitions into static assets during the build phase.
Design Tokens - Configures central theme objects containing design values that inject into styles during the build process.
Build-Time Style Compilers - Analyzes component logic at build time to convert shorthand properties and style objects into standard CSS class names.
Zero-Runtime Styling Engines - Resolves all component styles and variants during compilation to remove the need for a browser-side styling library.
Build-Time CSS Extraction - Extracts component styles into standalone CSS files during the build process to eliminate runtime overhead.
Static Style Generators - Compiles dynamic component styles into optimized, static CSS files during the build process to eliminate runtime styling overhead.
CSS Variable Theming - Transforms centralized design tokens into native CSS variables to enable dynamic, theme-aware styling without a JavaScript runtime engine.
Design Token Systems - Provides a configuration-driven system for managing design tokens and transforming them into CSS variables for consistent application styling.
Right-To-Left Support - Automatically generates mirrored CSS rules for right-to-left languages during the build process.
RTL Generation Tools - Automatically generates mirrored stylesheets for right-to-left languages by detecting layout direction attributes.
Component Styling - Defines encapsulated component styles and variant-based logic that compiles into standard class names and CSS rules.
Style Encapsulations - Supports encapsulated, reusable component styles that remain isolated and maintainable through build-time processing.
Global CSS Stylings - Injects site-wide styles into the application bundle from a top-level entry point for consistent visual presentation.
Static Style Extraction - Extracts colocated styles into static CSS files during the build process to eliminate runtime styling overhead.
CSS Styling - Creates static CSS classes from style objects or theme-aware callbacks that extract into external files.

Historial de estrellas

muipigment-css

Name: mui/pigment-css
Author: mui

View on GitHub

1,125 estrellas55 forksTypeScriptMIT7 vistasgithub.com/mui/pigment-css/discussions/424

Pigment Css

Features

CSS-in-JS Compilers - Provides a zero-runtime styling framework that compiles component-level CSS-in-JS definitions into static assets during the build phase.
Design Tokens - Configures central theme objects containing design values that inject into styles during the build process.
Build-Time Style Compilers - Analyzes component logic at build time to convert shorthand properties and style objects into standard CSS class names.
Zero-Runtime Styling Engines - Resolves all component styles and variants during compilation to remove the need for a browser-side styling library.
Build-Time CSS Extraction - Extracts component styles into standalone CSS files during the build process to eliminate runtime overhead.
Static Style Generators - Compiles dynamic component styles into optimized, static CSS files during the build process to eliminate runtime styling overhead.
CSS Variable Theming - Transforms centralized design tokens into native CSS variables to enable dynamic, theme-aware styling without a JavaScript runtime engine.
Design Token Systems - Provides a configuration-driven system for managing design tokens and transforming them into CSS variables for consistent application styling.
Right-To-Left Support - Automatically generates mirrored CSS rules for right-to-left languages during the build process.
RTL Generation Tools - Automatically generates mirrored stylesheets for right-to-left languages by detecting layout direction attributes.
Component Styling - Defines encapsulated component styles and variant-based logic that compiles into standard class names and CSS rules.
Style Encapsulations - Supports encapsulated, reusable component styles that remain isolated and maintainable through build-time processing.
Global CSS Stylings - Injects site-wide styles into the application bundle from a top-level entry point for consistent visual presentation.
Static Style Extraction - Extracts colocated styles into static CSS files during the build process to eliminate runtime styling overhead.
CSS Styling - Creates static CSS classes from style objects or theme-aware callbacks that extract into external files.

Alternativas open-source a Pigment Css

Proyectos open-source similares, clasificados según cuántas características comparten con Pigment Css.

atlassian-labs/compiled
atlassian-labs/compiled
2,049Ver en GitHub
Compiled is a styling framework for React that converts component-level styles into static, atomic CSS files during the build process. By utilizing build-time abstract syntax tree transformations, the library eliminates the need for runtime style injection, ensuring that styles are processed and optimized before the application executes. The framework distinguishes itself by decomposing complex style objects into individual, reusable utility classes, which minimizes total stylesheet size. It maintains support for dynamic component properties by mapping them to CSS custom variables, allowing f
TypeScriptbabelcsscss-in-js
Ver en GitHub2,049
callstack/linaria
callstack/linaria
12,335Ver en GitHub
Linaria is a zero-runtime CSS-in-JS library and static CSS generator. It evaluates JavaScript expressions at build time to extract styles from tagged template literals into standalone, static CSS files, removing the need for a runtime style injection engine. The library distinguishes itself by mapping component props to CSS custom properties, enabling dynamic styling and runtime property updates without regenerating stylesheets. It utilizes a build-time evaluation engine to resolve interpolations and a hashing system to generate scoped class names that prevent style collisions. The project c
TypeScript
Ver en GitHub12,335
facebook/stylex
facebook/stylex
9,126Ver en GitHub
StyleX is a type-safe CSS-in-JS library and atomic CSS compiler that transforms JavaScript style definitions into optimized static CSS and type-safe class names. It functions as a multi-framework styling tool, generating standard CSS assets compatible with various JavaScript UI frameworks and server components. The system includes a CSS design token system and theme engine for managing shared constants and composing visual schemes. It allows for the creation of light, dark, and custom themes through variable overrides and token inheritance. The project covers component styling through object
JavaScript
Ver en GitHub9,126
vanilla-extract-css/vanilla-extract
vanilla-extract-css/vanilla-extract
10,387Ver en GitHub
vanilla-extract is a type-safe CSS-in-JS library and zero-runtime CSS framework. It uses TypeScript to define styles and design tokens, compiling these definitions into static CSS files during the build process to eliminate styling overhead in the browser. The system acts as a scoped CSS generator, producing unique class names and local variables to prevent global style leakage and naming collisions. It provides a type-safe styling tool that validates CSS property values and ensures design tokens adhere to defined themes during development. The framework covers comprehensive styling utilitie
TypeScript
Ver en GitHub10,387

Ver las 30 alternativas a Pigment Css

Colecciones destacadas con Pigment Css

Colecciones seleccionadas manualmente donde aparece Pigment Css.

Librerías CSS-in-JS sin tiempo de ejecución

Preguntas frecuentes

¿Qué hace mui/pigment-css?

¿Cuáles son las características principales de mui/pigment-css?

Las características principales de mui/pigment-css son: CSS-in-JS Compilers, Design Tokens, Build-Time Style Compilers, Zero-Runtime Styling Engines, Build-Time CSS Extraction, Static Style Generators, CSS Variable Theming, Design Token Systems.

¿Qué alternativas de código abierto existen para mui/pigment-css?

Las alternativas de código abierto para mui/pigment-css incluyen: atlassian-labs/compiled — Compiled is a styling framework for React that converts component-level styles into static, atomic CSS files during… callstack/linaria — Linaria is a zero-runtime CSS-in-JS library and static CSS generator. It evaluates JavaScript expressions at build… facebook/stylex — StyleX is a type-safe CSS-in-JS library and atomic CSS compiler that transforms JavaScript style definitions into… vanilla-extract-css/vanilla-extract — vanilla-extract is a type-safe CSS-in-JS library and zero-runtime CSS framework. It uses TypeScript to define styles… seek-oss/treat — Treat is a styling library that extracts CSS from JavaScript definitions during the build process to eliminate runtime… tamagui/tamagui — Tamagui is a cross-platform user interface framework designed to build high-performance, themeable applications that…