awesome-repositories.com
ब्लॉग
MCP
awesome-repositories.com

AI-संचालित खोज के साथ बेहतरीन ओपन-सोर्स रिपॉजिटरी खोजें।

एक्सप्लोर करेंक्यूरेटेड खोजेंओपन-सोर्स विकल्पसेल्फ-होस्टेड सॉफ्टवेयरब्लॉगसाइटमैप
प्रोजेक्टहमारे बारे मेंहम रैंकिंग कैसे करते हैंप्रेसMCP सर्वर
कानूनीगोपनीयताशर्तें
© 2026 Bringes Technology SRL·VAT RO45896025·hello@awesome-repositories.com
·
facebook avatar

facebook/stylex

0
View on GitHub↗
9,126 स्टार्स·391 फोर्क्स·JavaScript·mit·9 व्यूज़stylexjs.com↗

Stylex

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-based definitions and style composition, alongside comprehensive design token management and theme orchestration. It enforces style constraints and type-safety during development to prevent runtime CSS errors.

Integrations are available for various build tools and environments, including Vite, Next.js, Bun, Rspack, and PostCSS.

Features

  • CSS-in-JS Compilers - Compiles JavaScript style definitions into static atomic CSS files to eliminate runtime overhead.
  • Atomic CSS Generators - Transforms JavaScript style definitions into optimized atomic CSS and type-safe class names at build time.
  • Styling Constants - Uses typed JavaScript constants instead of raw strings for classes and variables to ensure type-safety.
  • Adaptive Color Schemes - Defines distinct visual schemes for light and dark modes using native CSS variables.
  • Cross-Framework Styling - Generates standard CSS assets that ensure consistent visual styles across different JavaScript frameworks and server components.
  • CSS Variable Theming - Implements theming by mapping design tokens to native CSS variables for efficient runtime switching.
  • Design Token Management - Provides a central system for organizing and managing shared constants and variables to maintain a uniform visual identity.
  • Design Tokens - Maintains shared constants in a centralized configuration to ensure visual consistency across the codebase.
  • CSS Variable Token Mappings - Maps design tokens to unique CSS variables during compilation to prevent naming collisions.
  • Design Token Systems - Provides a framework for defining and managing shared constants and variables through hierarchical design tokens.
  • Multi-Framework Styling Tools - Generates standard CSS and class names that are compatible across various JavaScript UI frameworks and server components.
  • Style Composition Engines - Implements a deterministic system for merging multiple style definitions and resolving property precedence.
  • Styling Frameworks - Generates standard class names and inline styles that work across different JavaScript UI frameworks.
  • Type-Safe Implementations - Provides a styling system that uses static types to ensure CSS properties are valid and consistent across components.
  • Declarative Style Objects - Provides an object-based syntax for defining visual properties that are compiled into atomic CSS.
  • Theme Definitions - Allows the creation of structured visual themes using sets of variable overrides applied across components.
  • Theme Inheritance Systems - Provides a system where specialized themes inherit base token configurations and apply selective overrides.
  • Type-Safe Style Schemas - Enforces CSS property and value constraints using static type definitions during development.
  • UI Theming - Implements scalable light and dark modes or custom visual themes using variable overrides and hierarchical tokens.
  • Token Assignment - Assigns unique CSS names to reusable style variables at compile time to maintain consistency.
  • CSS Build Tools - Transforms style definitions into optimized CSS during the build process for final output integration.
  • CSS Optimization - Optimizes style definitions into minified and efficient CSS to improve loading speeds.
  • Cross-Environment Style Aggregation - Aggregates style definitions from both server and client environments into a single optimized CSS asset.
  • Build Tool Integrations - Integrates with build tools to extract and aggregate styles into final CSS assets.
  • Style Optimizers - Analyzes style objects at build time to resolve constants and remove unused declarations.
  • Hot Module Reloaders - Injects temporary style assets via a development server to apply visual changes without browser refreshes.
  • Server-Side Rendering Style Registries - Generates shared CSS across client and server bundles to maintain consistency in server-side architectures.
  • Color Scheme Managers - Implements automated theme switching based on system or browser settings using native CSS functions.
  • Derived Tokens - Calculates new style variables from existing tokens at compile time to maintain a hierarchical theme.
  • Style Linting - Flags invalid styles and provides automated fixes for common errors during development to prevent runtime mistakes.
  • Component Styling - Applies styles at runtime using logic expressions to ensure only active visual states are rendered.
  • Cross-Component Style Sharing - Passes style definitions as props between different files to maintain consistent styling across boundaries.
  • Dynamic Styling Systems - Changes the visual appearance of components based on state, props, or shared context values.
  • Styling Variants - Maps component properties to specific style objects to switch visual states based on props.
  • State-Based Style Application - Sets different style values based on pseudo-classes or media queries to respond to element states and environment changes.
  • Dynamic Style Restrictions - Prevents the use of dynamic style definitions in specific props to ensure styles remain predictable and optimizable.
  • Property Allowlists - Validates that style properties adhere to specific allowlists or blocklists to restrict which CSS rules are applied.
  • CSS Variable Styling Systems - Utilizes CSS variables to propagate styling values down the DOM tree from parent to children.
  • Typed Style Variables - Assigns specific CSS types to variables to ensure type-safety and enable behaviors like angle animations.
  • Theme Management - Merges multiple object constants into a single theme to reuse shared values and reduce redundancy.
  • Theme Composition - Merges base token sets with specific overrides using shared functions to create related themes.
  • Theme Overriding Systems - Allows assigning themes to specific elements to override style variables for that element and its descendants.

स्टार हिस्ट्री

facebook/stylex के लिए स्टार हिस्ट्री चार्टfacebook/stylex के लिए स्टार हिस्ट्री चार्ट

AI सर्च

और अधिक बेहतरीन रिपॉजिटरी खोजें

अपनी ज़रूरत को सरल भाषा में बताएं — AI हजारों क्यूरेटेड ओपन-सोर्स प्रोजेक्ट्स को प्रासंगिकता के आधार पर रैंक करता है।

Start searching with AI

Stylex के ओपन-सोर्स विकल्प

समान ओपन-सोर्स प्रोजेक्ट्स, जो Stylex के साथ साझा की गई सुविधाओं के आधार पर रैंक किए गए हैं।
  • webstudio-is/webstudiowebstudio-is का अवतार

    webstudio-is/webstudio

    8,240GitHub पर देखें↗

    Webstudio is a visual CMS and website builder that provides a visual development environment for designing and publishing websites. It functions as an AI-powered design tool, a REST and GraphQL API client, and an atomic CSS compiler. The platform distinguishes itself through generative AI capabilities for creating layout variants and refining visual styles from text prompts. It integrates a headless CMS workflow that maps external data sources to visual components and utilizes a specialized compiler to convert design tokens into deduplicated atomic CSS for optimized page load speeds. The sys

    TypeScriptaccessibilityalternativecloudflare
    GitHub पर देखें↗8,240
  • callstack/linariacallstack का अवतार

    callstack/linaria

    12,335GitHub पर देखें↗

    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
    GitHub पर देखें↗12,335
  • mui/pigment-cssmui का अवतार

    mui/pigment-css

    1,125GitHub पर देखें↗

    Pigment CSS is a framework-agnostic styling tool that moves component style processing from the browser runtime to the build phase. By parsing component source code and theme configurations during compilation, it generates standalone, optimized CSS files and standard class names, effectively eliminating the need for runtime style calculation. The library provides a system for managing design tokens, such as colors and spacing, by transforming them into native CSS variables. This approach allows for dynamic styling and theme-aware logic without requiring a JavaScript-based engine. It also supp

    TypeScript
    GitHub पर देखें↗1,125
  • stitchesjs/stitchesstitchesjs का अवतार

    stitchesjs/stitches

    7,785GitHub पर देखें↗

    Stitches is a CSS-in-JS library and near-zero runtime CSS engine designed to define styles in JavaScript with minimal overhead. It functions as a variant-based styling framework and a tool for server-side rendered CSS, ensuring styles are extracted and rendered on the server to prevent layout shifts during client hydration. The project distinguishes itself through a structured variants API, allowing for the creation of multiple visual states for components that can be toggled via properties. It implements a system for design system development, focusing on high-performance UI styling and the

    JavaScript
    GitHub पर देखें↗7,785
Stylex के सभी 30 विकल्प देखें→

अक्सर पूछे जाने वाले प्रश्न

facebook/stylex क्या करता है?

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.

facebook/stylex की मुख्य विशेषताएं क्या हैं?

facebook/stylex की मुख्य विशेषताएं हैं: CSS-in-JS Compilers, Atomic CSS Generators, Styling Constants, Adaptive Color Schemes, Cross-Framework Styling, CSS Variable Theming, Design Token Management, Design Tokens।

facebook/stylex के कुछ ओपन-सोर्स विकल्प क्या हैं?

facebook/stylex के ओपन-सोर्स विकल्पों में शामिल हैं: webstudio-is/webstudio — Webstudio is a visual CMS and website builder that provides a visual development environment for designing and… callstack/linaria — Linaria is a zero-runtime CSS-in-JS library and static CSS generator. It evaluates JavaScript expressions at build… mui/pigment-css — Pigment CSS is a framework-agnostic styling tool that moves component style processing from the browser runtime to the… stitchesjs/stitches — Stitches is a CSS-in-JS library and near-zero runtime CSS engine designed to define styles in JavaScript with minimal… atlassian-labs/compiled — Compiled is a styling framework for React that converts component-level styles into static, atomic CSS files during… tamagui/tamagui — Tamagui is a cross-platform user interface framework designed to build high-performance, themeable applications that…