A simple javascript utility for conditionally joining classNames together (by JedWatson)


Basic classnames repo stats
10 days ago

JedWatson/classnames is an open source project licensed under MIT License which is an OSI approved license.

Classnames Alternatives

Similar projects and alternatives to classnames

  • GitHub repo Tailwind CSS

    A utility-first CSS framework for rapid UI development.

  • GitHub repo twind

    The smallest, fastest, most feature complete Tailwind-in-JS solution in existence.

  • GitHub repo clsx

    A tiny (228B) utility for constructing `className` strings conditionally.

  • GitHub repo storybook

    📓 The UI component explorer. Develop, document, & test React, Vue, Angular, Web Components, Ember, Svelte & more!

  • GitHub repo webpack

    A bundler for javascript and friends. Packs many modules into a few bundled assets. Code Splitting allows for loading parts of the application on demand. Through "loaders", modules can be CommonJs, AMD, ES6 modules, CSS, Images, JSON, Coffeescript, LESS, ... and your custom stuff.

  • GitHub repo PostCSS

    Transforming styles with JS plugins

  • GitHub repo styled-system

    ⬢ Style props for rapid UI development

  • GitHub repo styletron

    :zap: Toolkit for component-oriented styling

  • GitHub repo windicss

    Next generation utility-first CSS framework.

  • GitHub repo

  • GitHub repo brise

    React Library for TailwindCSS, similar to styled-components

  • GitHub repo gs-component-library

    React reusable component library

  • GitHub repo xcls

    Declarive className merge utility

NOTE: The number of mentions on this list indicates mentions on common posts. Hence, a higher number means a better classnames alternative or higher similarity.


Posts where classnames has been mentioned. We have used some of these posts to build our list of alternatives and similar projects - the last one was on 2021-04-13.
  • A simple strategy for structuring TailwindCSS classnames | 2021-04-13
  • Netlify will refactor React code style from global CSS to Tailwind CSS | 2021-03-28
    For readability, instead of making their own classname joiner, they could have used which does everything they want but (IMO) a cleaner way
  • I figured out a nice way to merge conditional classNames in react | 2021-03-28
    you’ll love this too: cx
  • Just-In-Time: The Next Generation of Tailwind CSS
    I would use the classnames package and separate each responsive class into its own string.
  • Just-In-Time: The Next Generation of Tailwind CSS – Tailwind CSS | 2021-03-15
    The mental model that worked for me was that if you use classnames (npm), then Tailwind is suddenly a superpowered sx prop for primitives.
  • You don't know the classNames library | 2021-03-10
    This tiny open-source library, originally created by JedWatson, is nothing but a versatile string “concatenator.” Currently sitting at over 6M weekly downloads, it rose to popularity alongside React - the UI library that it’s most commonly used with.
  • Componente Snackbar com React do zero | 2021-02-17
  • TailwindCSS vs Styled-Components in ReactJs | 2021-02-17
    That's true and it's something that did put a bit of a dampener on my view of the framework. With having so many utility classes being added on to each element it's very easy to end up with huge class property values. This can easily cause things like useless classes remaining on elements that aren't necessarily needed etc. A good package to use is the classNames package that will combine class names together. Allowing you to format your elements a little cleaner.
  • How to create a React Component Library with Storybook + PostCSS | 2021-02-12
    Classnames: Joins CSS class names based on a set of conditions set beforehand. It helps the logic needed to pass CSS classes to the component.