Please note that as of October 24, 2014, the Nokia Developer Wiki will no longer be accepting user contributions, including new entries, edits and comments, as we begin transitioning to our new home, in the Windows Phone Development Wiki. We plan to move over the majority of the existing entries. Thanks for all your past and future contributions.

Setting Colors in Carbide.ui

From Wiki
Jump to: navigation, search
Article Metadata
Created: kamalakshan (30 Jun 2009)
Last edited: hamishwillee (07 May 2012)


The Carbide.ui Referenced Colors view allows you to specify groups of related theme colors. These colors can be used to style certain types of theme components including text and status icons.

Each group can include four colors: the base color and up to three related hues.

6-30-2009 1-13-27 PM.png

All colors in a group will auto-update when the parent is edited.

This feature is used to create a set of colors which are “linked” to multiple components in the theme. This is useful if the theme uses a limited color

set. It also allows the user to change the colors quickly in the theme.

How to create Referenced Colors in carbide.ui

Step 1) Select Resources -> Active Tab Items ->Reference to Color -> Create New.

6-30-2009 1-19-31 PM.png

Step 2) Now check notice the Referenced colors view

6-30-2009 1-20-41 PM.png

Step 3) The following Referenced Colors view is opened with a “root” color and three empty derived colors. By moving the mouse over the derived empty colors, you can change the intensity of each color. Same applies for the root color as shown below.

Step 4) Name the reference color appropriately

6-30-2009 1-22-56 PM.png

Step 5) You can also add new copies of the color by clicking the “+” button. The root color can then be adjusted as required

How to apply the referenced color

Step 1) Right click on the item to which you want to apply the color. In this case Active tab Items.

Step 2) Reference to Color -> Colors -> Active Tab Items (name of the referenced color we created)

6-30-2009 1-31-30 PM.png

This page was last modified on 7 May 2012, at 06:03.
56 page views in the last 30 days.