Styled Components

Styled Components is a CSS-in-JS library that allows you to write CSS in your JavaScript files. It is a popular library that is used in many React projects.

Full documentation: https://styled-components.com/

Usage

import styled from 'styled-components';

const Button = styled.button`
  background-color: #fff;
  border: 1px solid #000;
  border-radius: 4px;
  color: #000;
  cursor: pointer;
  font-size: 16px;
  padding: 8px 16px;
`;

export const App = () => <Button>Button</Button>;

import styled from 'styled-components';

const Button = styled.button`
  background-color: #fff;
  border: 1px solid #000;
  border-radius: 4px;
  color: #000;
  cursor: pointer;
  font-size: 16px;
  padding: 8px 16px;
`;

export const App = () => <Button>Button</Button>;