Vipps design guidelines
These guidelines will help you use the Vipps payments buttons, logo and mark within your websites.
Table of Contents
Vipps buttons are only available in one style: white text on orange. The Vipps Hurtigkasse button is always in Norwegian. Don’t create buttons with your own localized text.
Dos and Don’ts
- Use only the buttons provided by Vipps.
- Use the same style of button throughout your site.
- Ensure that the size of the Vipps buttons remains equal to or larger than other buttons.
- Ensure that you choose a background color that contrasts with the button color.
- Don't create your own Vipps buttons or alter the font, color, button radius, or padding within the button in any way.
- Don't use Vipps buttons to initiate any action other than a payment flow.
- Don't make the Vipps button smaller than other buttons.
- Don't use a background color that's similar to the button color.
Vipps logo and mark
Use either the Vipps logo or the Vipps mark when showing Vipps as a payment option. Choose the option that best matches the way in which other payment options are displayed.
Download the Vipps logo and the Vipps mark in SVG file formats.
LINK TO DOWNLOAD
Use the Vipps logo with other brand logos.
If you're using the full logos of other brands to indicate different payment options in your payment flow, favor the Vipps logo over the Vipps mark. Display "Vipps" in text next to the logo if you're doing so for other brands. Don't alter the Vipps logo in any way. Use only the logo provided by Vipps.
Use the Vipps mark with other brand identities in credit card format.
If you're using brand identities displayed in credit card format to indicate different payment options in your payment flow, favor the Vipps mark over the Vipps logo. Display "Vipps" in text next to the mark if you're doing so for other brands. Don't change the color or weight of the mark's outline or alter the mark in any way. Use only the mark provided by Vipps.
Adjust the height to match the other brand identities displayed in your payment flow. Don't make the Vipps logo or mark smaller than other brand identities.
Dos and Don’ts
- Use only the Vipps logo and mark provided by Vipps.
- Use the Vipps logo or mark to indicate Vipps as a payment option during payment flows.
- Choose the logo or mark that best matches the way in which other brand identities are displayed.
- Don't create your own logo or mark or alter them in any way.
- Don't display the Vipps logo or mark in a different or smaller size than the other payment options.
Using Vipps in text
You may use text to indicate Vipps as a payment option and to promote Vipps in your marketing communication.
Capitalize the letter "V"
Always use an uppercase "V" followed by lowercase letters. Don't capitalize the full name "Vipps" unless matching the typographic style on your website. Never use an uppercase "Vipps" in your marketing communication.
Match the style on your website
"Vipps" should be set in the same font and typographic style as the rest of the text on your website. Don't try to mimic Vipps's typographic style.
Don't translate Vipps Hurtigkasse
"Vipps Hurtigkasse" should always be written in Norwegian. Don't translate it to another language.
Maximize your conversions with checkout flows that let customers quickly and easily review their payment information and confirm their purchase.
The following are best practices:
Make Vipps the primary payment option
People like using Vipps for faster checkout. Where possible, display the Vipps button prominently, and consider making it the default or only payment option.
Let your customers make purchases without an account
Account creation slows down the checkout process and can lead to abandoned carts. Use Vipps to enable faster guest checkout. If you'd like your customers to create an account, allow them to do so after they complete their purchase.
Add the Vipps Hurtigkasse button to product detail pages in addition to cart checkout
Speed up single-item checkout by letting customers make individual purchases right from your product detail pages.
Include Vipps on confirmation pages and receipts
When displaying payment information on confirmation pages and email receipts, make sure you indicate the customer has paid with Vipps and ensure that Vipps is displayed consistently with how other payment methods are displayed.