Get the App
SLTechnology News&Howtos  ›  Servers  › 

SharePoint Online development: creating and modifying palettes

Shulou Source: shulou.com Published: 2022-06-02 03:24:07 09月30日 Update

Blog Link: blog.51cto.com/13969817

Most companies have their own UI formatting standards and color styles, and it is likely that developers will need to create a new palette based on actual needs and then add it to a Site Collection theme. The easy way to do this is to have a tool on Microsoft's website called SharePoint Color Palette that provides a visual way to set up color palettes.

Download address: www.microsoft.com/en-us/download/details.aspx? id=38182

You can download and install it on your computer. Below is what the SharePoint palette tool looks like in action. On the left are all the different elements and swatches. You can change how elements are grouped by clicking on the groupby link in the upper right corner of the elements page.

For example, we can change the color of the top menu bar, you can choose a specific color in the Suite Bar Color Colorizer, or you can directly enter the RGB code, 243X125X89, save.

Note:

The last value is opacity, which is not important for Suite Bar, but if you define a dark color, it will overwrite some text or images.

After clicking "OK", the color changes made on the left are displayed in the preview. If you want to change the color of all elements, you can use the extraction pen in Color Picker to color them. If you don't like them, you can modify them separately. This will save a lot of time.

In addition to this, you can also change the background and text overlay of the page in oslo layout. Find the background color in the list on the left and modify the background color + brightness, which is a very nice feature.

After modifying the palette, save it. Next article will show you how to create a theme with the new palette.

Thank you for reading, welcome to offline communication ~

Tags: Colors palettes elements backgrounds themes tools text methods links pages development different important second part brightness code company available through picture address Apple Docker Huawei Linux macOS MariaDB Microsoft MySQL NVidia OPPO Reno Apple Docker Microsoft Shulou Technology NVidia