Pay Button
Customize the Button UI
Modify the payment button to match the style of your website
Customizing the button style is done differently depending on the JS framework you use.
Change the button to light mode by setting
theme
as light
. Default is dark
.Customizing the button UI in React
Add custom styles to the CrossmintPayButton
component using CSS. See the example of the React SDK below and note the className
attribute:
import { CrossmintPayButton } from "@crossmint/client-sdk-react-ui";
export default function Mint() {
return (
<div>
<CrossmintPayButton
projectId="_YOUR_PROJECT_ID_"
collectionId="_YOUR_CLIENT_ID"
className="xmint-btn"
/>
</div>
);
}