Style a React Component with Styled Components

InstructorSara Vieira

Share this video with your friends

Send Tweet

We are going to learn how to add styles to a react component using the styled-components library.

I've done a lesson on how to Style an HTML Element with Styled Components but now it's time to style React Components. We'll be able to wrap a React component in a styled component to extend the style of that component.

To style an HTML Element, you would do styled.{element} but with a component, you would replace the . with a () so it would look like styled({component})

Here, we will style a button from material-ui and adjust his size with css.