Customization and branding
Scopes come in a very flexible customization package where you can add your brand’s identity through colors, logos and arranging cards and categories.
For code templates and visual examples see our developer guide.
Header and background
The header allows for the most customization, as you can change the color of the background, insert your own branded logo, or use different text colors and fonts.
Creating a logo and using a specific color helps users identify more with a brand. You can use the color of your logo in the text, background or buttons also to create an overall look and feel.
We provide a set of several elements that you can use to change the look of your scope header, background and text color.
Things you can change
- Foreground color
- Background color
- Using the Ubuntu Shape
- Category header background
- Preview button color
- Logo overlay color
- Page header logo
- Page header foreground color
- Page header background
- Page header divider color
- Page header navigation background
To get inspired why not check out how the branded SoundCloud scope was created in this handy tutorial, or simply flick through the default scopes on your Ubuntu device.
See where each header component can sit in our Component section.
Category and card design
The templates define how result cards are laid out within a category, where you are free to use your own layout and rendering style using a template declared in your scope code; but there are rules.