How can I use global styles with styled-components?

How can I use global styles with styled-components?

You can use the createGlobalStyle function from styled-components to define global styles. Here's a basic example:

Can you show me a code snippet for that?

Sure! Here's a simple example:

import { createGlobalStyle } from 'styled-components';

const GlobalStyle = createGlobalStyle`
  body {
    margin: 0;
    padding: 0;
    font-family: 'Arial', sans-serif;
  }
`;

function App() {
  return (
    <> 
      <GlobalStyle />
      <h1>Hello World!</h1>
    </>
  );
}

What if I want to override some styles in a specific component?

You can still use styled-components for specific components. Just define your component styles normally, and they will override the global styles.