Darkbutton.js

import "./App.css";
import { GradientButton, DarkButton } from "./components/Button";
import StyledButton from "./components/Button";
import { ThemeProvider } from "styled-components";

const theme = {
  dark: {
    primaryColor: "#000",
    textColor: "#fff",
  },
  light: {
    primaryColor: "#fff",
    textColor: "#000",
  },
};

const App = () => {
  return (
    <ThemeProvider theme={theme}>
      <div className="App">
        <StyledButton>Button</StyledButton>
        <br />
        <StyledButton variant="outline">Button</StyledButton>
        <br />
        <GradientButton as="a">Button</GradientButton>
        <br />
        <DarkButton>Dark Theme Button</DarkButton>
      </div>
    </ThemeProvider>
  );
};

export default App;