Chart Colors

To provide a set of color definitions to draw data series elements (bars, pie wedges, and so on), use the colorSet attribute. Set <apex:chart colorSet="..."> to specify the colors to be used for every data series in a chart. Set colorSet on a data series component to specify colors for that series only.

A colorSet is a string that is a comma-delimited list of HTML-style hexadecimal color definitions. For example, colorSet="#0A224E,#BF381A,#A0D8F1,#E9AF32,#E07628". Colors are used in sequence. When the end of the list is reached, the sequence starts over at the beginning.

Here’s a pie chart that uses a custom color scheme for the pie wedge colors:

<apex:pageBlockSection title="Simple colorSet Demo">
    <apex:chart data="{!pieData}" height="300" width="400" background="#F5F5F5">
        <apex:legend position="left"/>
        <apex:pieSeries labelField="name" dataField="data1"
            colorSet="#37241E,#94B3C8,#4D4E24,#BD8025,#816A4A,#F0E68C"/>
    </apex:chart>
</apex:pageBlockSection>

Use the background attribute to set a background color for the entire chart.

You can use a colorSet with all data series components except <apex:radarSeries>. Additional colorSet details and further options for configuring colors of other chart elements are described for specific data series components.