Your first styled component

The humble, ubiqutuous button. It’s been done to death, revived, and then done some more. If you haven’t developed a button, you’ve certainly had to tweak a button to get it to look just like the designer wanted. Slightly smaller here. A bit larger on this screen, please. Oh and can we use green here? I think green works better.

OK OK. We get it. Buttons are varied, dynamic, and surprisingly hard to nail down with traditional CSS. In this section, we’ll begin charting our path to a surprisingly complex, yet easily maintainable and extensible styled-components button. Those seemingly N + 1 button states and variants? Easy peasy with styled-components and React. Let’s do this thing.