Skip to content

Instantly share code, notes, and snippets.

@lejonmanen

lejonmanen/Button.tsx

Created October 14, 2025 09:52
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save lejonmanen/a2efa075dc3c29e9620719c52dde9b9b to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save lejonmanen/a2efa075dc3c29e9620719c52dde9b9b to your computer and use it in GitHub Desktop.
Download ZIP
Button component with TypeScript and Tailwind
Raw
Button.tsx
import React from 'react';
// this button can have all <button> props from standard HTML
type ButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {
className?: string;
children?: React.ReactNode;
};
/* Example use:
<Button> I'm a button </Button>
*/
// Add your Tailwind utility classes in className below
const Button: React.FC<ButtonProps> = ({ children, className = '', onClick = null, ...props }) => (
<button
className={`tailwind-goes-here ${className}`}
onClick={onClick}
{...props}
>
{children}
</button>
)
// Call to action button
const CtaButton: React.FC<ButtonProps> = ({ children, className = '', onClick = null, ...props }) => (
<Button className=`cta ${className}` onClick={onClick}> {children} </Button>
)
export default Button;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment