Modifier classes

Author: aiCreated Oct 2, 2018Updated Nov 19, 2025

Labelsneeds: triage 🏷feature: proposal 💬

Do you want to request a feature or report a bug?

feature

What is the expected behavior?

To have the same modifiers syntax as in astroturf

javascript

const Button = styled('button')`
  color: black;
  border: 1px solid black;
  background-color: white;

  &.primary {
    color: blue;
    border: 1px solid blue;
  }

  &.color-green {
    color: green;
  }
`;

<Button primary color="green">

Compare to ${ } interpolation it keeps CSS syntax. CSS highlight and autocomplete works.

Source: callstack/linaria

View original on GitHub View discussion on GitHub