Add up to 24 more colors to your Squarespace Palette, easily use and update these colors in your SquareKicker Extension.
In your SquareKicker Extension you can easily update, add and remove additional custom colors to your SquareKicker Color Palette. If you are already familiar with how the Squarespace Color Palette works, SquareKicker's Color Palette behaves similarly, by linking colors across your site so you can quickly and easily modify multiple elements at once.
Where can I find the color picker?
You'll find the color picker in every SquareKicker block, section and tool that uses color in the SquareKicker extension. You can also manage your color palette from the top level SquareKicker menu. Go to Settings, Color Palette will be the first option in the list.
How do I create swatches and where are they saved?
You can create up to 24 swatches for your palette. To save a color to your palette go to the 'Palette' tab and under your 'SquareKicker Palette' click the '+' button to add a new color to your list of saved swatches. Saved colors will show across your whole extension regardless of which element you saved the original color to.
Linked Color Variables
You can select one of the 5 colors from your Squarespace Color Palette. These can be set in your Squarespace Site Styles. When you select a Squarespace color, this color will now be linked to this specific Squarespace Color Variable, meaning that if you change this color in your Squarespace Site Styles, this will change the color of this element, and any other element you applied with this color variable on your site with SquareKicker.
Likewise, when you edit a color in the SquareKicker Color Palette, the edited color will be updated wherever this color variable has been applied on your site. When you edit or delete a color from your SquareKicker Palette, there’ll be a handy notification letting you know how many elements this change affects.
Creating variations of the same color.
Easily create multiple swatches with the same color but with different opacity versions eg. 20%, 50%, 80% and 100%. First select a color from either your Squarespace or SquareKicker Color Palette and then click the '+' button. The color picker will open starting from the color you selected. Select your desired opacity and click 'create.' The new variation will be saved into your SquareKicker Palette.
Which color formats can I use? RGB, HEX, HSL and CSS Color Keywords
We want you to have to full control of your designs and add color to your site with ease. The color picker accepts five different color formats. You can use HEX, RGB, HSL or CSS Color Keywords. You can also input one of these values and see the color expressed in all formats, so it doubles as a handy converter. You can type in this input area and the color format will automatically be recognised so you can copy and paste your color directly into SquareKicker with any format.
SquareKicker remembers what color format was used to create your color. When you hover over your colors, you will see the saved color and format displayed in a tooltip.
Removing a color from your block
To remove or clear a SquareKicker color from an element click the 'reset' button on the high level menu or hover over the selected color, wait for the ellipses menu to show, click to show the drop down and then click 'DESELECT'.
How do I delete a color from my SquareKicker Palette?
To remove a color from your SquareKicker Palette, hover over the selected color, wait for the ellipses menu to show, click for the dropdown then click 'DELETE'. If this color is applied to multiple elements you will be notified with how many times this color is being used before the delete is confirmed. Once deleted, any element that was assigned this color will be reset back to the default Squarespace color.
Can I make a custom color for a single element?
Absolutely, sometimes you just want that one element on your website to look completely unique! In the color picker you use both 'Palette' and 'Custom' options. In both of these tabs you can create new colors for elements on your site, note: custom colors are not saved to your palette.