テスト

import React from 'react';

const App = () => {
  const buttonStyle = {
    backgroundColor: 'blue',
    color: 'white',
    padding: '10px 20px'
  };

  return <button style={buttonStyle}>Click me</button>;
};

export default App;

// App.module.css
.button {
  background-color: blue;
  color: white;
  padding: 10px 20px;
}

// App.js
import React from 'react';
import styles from './App.module.css';

const App = () => {
  return <button className={styles.button}>Click me</button>;
};

export default App;

import React from 'react';
import styled from 'styled-components';

const StyledButton = styled.button`
  background-color: blue;
  color: white;
  padding: 10px 20px;
`;

const App = () => {
  return <StyledButton>Click me</StyledButton>;
};

export default App;

import React from 'react';

const App = () => {
  return <button className="bg-blue-500 text-white py-2 px-4">Click me</button>;
};

export default App;

import React from 'react';
import Button from '@material-ui/core/Button';

const App = () => {
  return <Button color="primary">Hello World</Button>;
};

export default App;