Checkout Styling
Customise your checkout with your brand's colours, logos, fonts, and more on the Razorpay Dashboard.
Customise your Razorpay Checkout to match your brand's identity by adjusting colours, logos, title styles, fonts, border styles, and sidebar graphics. Additionally, you can show the Razorpay trusted business badge to enhance customer trust in your brand.
Handy Tips
- All the below changes will reflect on , , , , and .
- You can switch between mobile and desktop views to preview changes.
You can customise the checkout background colour according to your brand colour.
- Log in to the .
- Navigate to Accounts & Settings → Checkout Styling in the Checkout settings section.
- In the Background Color field, click Edit.
- You can choose to enter the RGB, HSL or HEX code of your brand colour.
- Click Save all changes.
Show the Razorpay trusted badge on your checkout to build credibility as a trusted business. This reassures your customers (who otherwise might have dropped off due to lack of trust) that they can safely transact with your brand. Know more about
.- Log in to the .
- Navigate to Accounts & Settings → Checkout Styling in the Checkout settings section.
- Toggle on the Razorpay trusted badge field.
- Click Save all changes.
Decide how you want to display your brand logo and title on checkout. You can update the brand name displayed to your customers in the following places:
- On transaction and refund emails sent to customers.
- On the links sent to customers for Payment Links , Payment Pages, Invoices and Subscriptions.
- As the beneficiary name when you create a Smart Collect Customer Identifier. Know more about .
Handy Tips
- You can update the brand name only to one that is at least 80% similar to the company name or domain name.
- This feature is available only for the registered Razorpay users.
- Only users with 'Owner' or 'Admin' roles can update the brand name.
- Bank-related SMS or credit card statements sent to customers will not have the brand name since these are managed by the banks and not Razorpay. Such communication will display the billing name provided by you during account creation and activation process.
-
Log in to the
. -
Navigate to Accounts & Settings → Checkout Styling in the Checkout settings section.
-
In the Title style field, click Edit.
-
Choose a title style based on your requirement.
Best for square logos, displaying both your logo and brand name.
- Click Continue to upload.
- Enter your brand name or business name.
- Drag the file or click Upload to add your logo.
- Click Save and continue.
Handy Tips
- The logo file size should not exceed 5MB.
- Upload a square image of minimum dimensions 1080x1080 px (aspect ratio 1:1).
-
Click Save all changes.
Choose the border style for various elements on your checkout, such as the checkout, logo, account and payment options.
- Log in to the .
- Navigate to Accounts & Settings → Checkout Styling in the Checkout settings section.
- In the Border style field, you can select rounded or sharp border style based on your requirement.
- Click Save all changes.
Select a font for your brand based on your requirement.
- Log in to the .
- Navigate to Accounts & Settings → Checkout Styling in the Checkout settings section.
- In the Font field, select a font for your brand from the drop-down list to apply it to all text on the checkout.
- Click Save all changes.
Enhance your checkout sidebar with a decorative graphic. This setting is available only in desktop view.
- Log in to the .
- Navigate to Accounts & Settings → Checkout Styling in the Checkout settings section.
- Toggle on the Sidebar graphic field and select a design pattern that fits your needs.
- Click Save all changes.
Was this page helpful?