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

Discover the best open-source repositories with AI-powered search.

ExploreCurated searchesOpen-source alternativesSelf-hosted softwareBlogSitemap
ProjectMCP serverAboutHow we rankPress
LegalPrivacyTerms
© 2026 Bringes Technology SRL·VAT RO45896025·hello@awesome-repositories.com
lukeed avatar

lukeed/clsx

0
View on GitHub↗
9,791 stars·180 forks·JavaScript·MIT·16 views

Clsx

clsx is a JavaScript utility for constructing space-separated CSS class strings. It functions as a logic-based string builder that merges strings and objects into a single string by evaluating the truthiness of provided values.

The utility orchestrates the generation of HTML class attributes by filtering out null or undefined values. It enables conditional styling by combining static and dynamic classes, which allows for the management of UI styling based on state or interaction.

The project handles a variety of input structures, including arrays and objects, to produce a unified list of active styles. It is commonly used as a helper for managing conditional class names in React components.

Features

  • Dynamic Class Management - Provides a utility for conditionally applying CSS classes based on state by merging strings and objects.
  • Truthiness Evaluators - Evaluates the truthiness of mixed inputs to filter out inactive style candidates.
  • Conditional Classname Builders - Functions as a specialized builder for constructing CSS class lists based on truthy or falsy values.
  • CSS Class-Based Styling - Generates conditional CSS class strings by combining strings, arrays, and objects based on truthiness.
  • Class Merging - Orchestrates the merging of various input types into a final, filtered string of CSS classes.
  • Conditional Class Mappings - Provides the logic to map object keys to CSS classes based on the truthiness of their values.
  • Component Styling - Enables a reusable way to compose static and dynamic styles for cleaner component class lists.
  • Dynamic Styling Systems - Facilitates dynamic UI styling by switching CSS classes on and off based on component state.
  • React Styling Utilities - Simplifies the management of conditional class strings specifically within React component rendering.

Star history

Star history chart for lukeed/clsxStar history chart for lukeed/clsx

How this analysis was created: This summary and feature list are AI-generated from collected project material and can contain mistakes. Stars, license and language are imported from GitHub. Inclusion does not mean that we have tested or audited this project. Check the source documentation for any feature you depend on. Learn more on our About page.

AI search

Explore more awesome repositories

Describe what you need in plain English — the AI ranks thousands of curated open-source projects by relevance.

Start searching with AI

Frequently asked questions

What does lukeed/clsx do?

clsx is a JavaScript utility for constructing space-separated CSS class strings. It functions as a logic-based string builder that merges strings and objects into a single string by evaluating the truthiness of provided values.

What are the main features of lukeed/clsx?

The main features of lukeed/clsx are: Dynamic Class Management, Truthiness Evaluators, Conditional Classname Builders, CSS Class-Based Styling, Class Merging, Conditional Class Mappings, Component Styling, Dynamic Styling Systems.

Which projects share features with lukeed/clsx?

Projects with overlapping indexed features include: jedwatson/classnames — classnames is a JavaScript utility for conditionally joining CSS class names into a single space-separated string. It… unocss/unocss — UnoCSS is an atomic CSS engine and utility-first framework that generates styles on-demand based on the specific… vuejs/vue — Vue is a progressive, component-based JavaScript framework designed for building reactive user interfaces and… lit/lit — Lit is a library for building lightweight, interoperable web components. It provides a base class that leverages… reactjs/react-transition-group — This project is a transition component library for React that manages CSS animations during the mounting and… stubbornella/oocss — Object-Oriented CSS (OOCSS) is a CSS methodology and framework that structures stylesheets around reusable, composable…

Projects sharing features with Clsx

These projects share indexed features with Clsx. Shared tags can include platform or build tooling; verify the primary use case before treating a result as a replacement.
  • jedwatson/classnamesJedWatson avatar

    JedWatson/classnames

    17,794View on GitHub↗

    classnames is a JavaScript utility for conditionally joining CSS class names into a single space-separated string. It functions as a class name manager that maps boolean flags and objects to specific styles for HTML attribute assignment. The tool resolves abstract class identifiers to computed values, facilitating integration with modular styling systems. It allows for the mapping of dynamic identifiers to scoped class names through a dedicated module resolver. The utility processes strings, arrays, and objects to handle dynamic class name management. It includes capabilities for recursive a

    JavaScript
    View on GitHub↗17,794
  • unocss/unocssunocss avatar

    unocss/unocss

    18,854View on GitHub↗

    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

    TypeScriptatomic-cssengineunocss
    View on GitHub↗18,854
  • vuejs/vuevuejs avatar

    vuejs/vue

    209,900View on GitHub↗

    Vue is a progressive, component-based JavaScript framework designed for building reactive user interfaces and single-page applications. It centers on a declarative template system that transforms HTML into efficient render functions, allowing developers to organize complex interfaces into isolated, reusable units that synchronize automatically with application state. The framework distinguishes itself through a dependency-tracking reactivity system that monitors data access during rendering to trigger precise updates. It provides a flexible architecture that supports both incremental adoption

    TypeScriptframeworkfrontendjavascript
    View on GitHub↗209,900
  • lit/litlit avatar

    lit/lit

    21,679View on GitHub↗

    Lit is a library for building lightweight, interoperable web components. It provides a base class that leverages native browser APIs to encapsulate state, logic, and styles, allowing developers to create custom elements that function consistently across any modern web project. The framework distinguishes itself through a reactive property system that automatically triggers efficient, batched DOM updates. By utilizing tagged template literals, it defines declarative UI structures that are compiled into optimized update instructions. Its architecture emphasizes modularity through a reactive con

    TypeScripthtml-templateslitlit-element
    View on GitHub↗21,679
  • Compare all 30 related projects→