CSS to SCSS Converter

Enter one rule per line.

• * matches any name. Each & starts a new nesting level.
• With the default rules:
  • .c-card__img--cap → .c-card { &__img { &--cap { … } } }
  • .c-card--big → .c-card { &--big { … } }
  • .c-card.is-disabled → .c-card { &.is-disabled { … } }
• If a selector matches more than one rule, the rule that splits it into the most levels is used.
• Pseudo-elements and pseudo-classes such as ::before and :hover are nested automatically as &::before. You don't need to add rules for them.
• Leave this field empty to use standard BEM detection.
• Selectors that don't match any rule are output unchanged.