Do you want to save all of your brand colours as swatches to use throughout their website? Rocketspark has created this feature to improve your workflow and allow you to design beautiful websites, faster. Check out how to use Saved Brand Colours, below:
Please follow the below if you have just started your free trial site
If you have just started your free trial, you can click the "Do it Now" prompt on the right hand side of your Dashboard to add your brand colours OR you can click the "Change Design" button on the top left and head to the "Your Brand".
- You will be taken to the site wide design settings under "Your Brand"
- Within these settings, you can edit/add/remove the existing brand colours to match your brand.
- Make sure to click 'Save Changes' once completed.
- Below is more information and a helpful video to walk you through this process.
How to add, edit and remove brand colours
(To make this tour bigger, click the arrows on the right or zoom in)
1. Log into your Rocketspark Dashboard
2. Head to the top left-hand corner and go to Change Design.
3. After you have done that, head to the Your Brand section
4. Once you have clicked on that section, you will see Brand Colours and a little plus icon next to it, click on that icon to activate this new feature.
5. Once you have clicked on that plus icon, you will see a pop up appear with the title Edit Colour Style which can be seen on the right-hand side of this screenshot below.
Note: Once this feature has been added, you are unable to remove it.
This pop up is where you will enter the name of the colour that you will want to use in the Name box and enter what you will use that colour for in the Description box. You will then use the colour picker underneath to pick the perfect colour for that specific type of text.
An example of this is :
Note: The description and title are merely for you, meaning what you enter in these boxes does not affect the functionality of this feature.
6. If you want to add another Brand colour to your website, head to where the plus icon is next to the title Brand Colours and click on that, this will bring up the Edit Colour Style pop up the box again.
7. Once you have entered all the colours you think you need like below:
Make sure you click Save Changes or if you would like to cancel any changes you have made, click the Cancel button
How do I use the Brand Colours feature throughout my website?
So, you have set up your brand colours in the My Brand section and now you would like to know how to use this throughout your website. Carry on reading the guide below as it will explain everything you will need to know:
(To make this tour bigger, click the arrows on the right or zoom in)
1. Once you are logged into your Rocketspark Dashboard, you can head to the top left-hand side and click on Change Design and head to Heading & Paragraphs.
Once you have done this, click on the little square that appears next to the heading you would like to edit, this is where you will choose the colours. Once you click on that square, you will see that the Brand Colours that you set up before will now appear in the colour picker.
Note: This will affect/change settings on a site-wide level, which means all of the text on your site will be changed. If you want to use the Brand Colours only in a specific stack, you will just need to head to the right-hand side of a stack and click the little colour wheel seen below instead of heading to the Change Design button.
Saved Brand Colours Compatibility (at this stage)
Yes | No |
Site-wide Change Design | Picture Block |
Grid Gallery (Title and Secondary title) | Feature Area |
Stack-Specific Design controls (However, stack-specific changes will override) | Grid Gallery (Picture overlay and text area background brand colour is able to be changed but won't automatically update from change design so you will need to head to Grid Gallery Settings to set that) |
Blog slider (Stack background) | Blog slider (fonts) |
Slideshow Stack | Horizontal Line (unless paragraph text is set to brand colour as this controls line colour) |
Note: If your website was built by a designer, they may have enabled restrictions. If you want to have these removed you can contact the Customer Success team or reach out to your designer.