<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2007/12/29/changing-the-swatch-grid-background-color-for-a-colorpicker-control-in-flex-3/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
		layout="vertical"
		verticalAlign="top"
		backgroundColor="white"
		creationComplete="init();" viewSourceURL="srcview/index.html">

    <mx:Style>
        .myCustomSwatchPanelStyleName {
        	/* border */
            swatchBorderColor: white;
            swatchBorderSize: 1;

            /* highlight */
            swatchHighlightColor: black;
            swatchHighlightSize: 2;
            
            /* gap */
            horizontalGap: 2;
            verticalGap: 2;

			/* background */            
            swatchGridBackgroundColor: red;
        }
    </mx:Style>

	<mx:Form>
		<mx:FormItem label="default:">
			<mx:ColorPicker />
		</mx:FormItem>
		<mx:FormItem label="horizontalGap/verticalGap = 2:">
			<mx:ColorPicker id="colorPicker"
					swatchPanelStyleName="myCustomSwatchPanelStyleName" />
		</mx:FormItem>
	</mx:Form>

</mx:Application>