syncfusion-winforms-color-picker-dropdown

Q: How do I install syncfusion-winforms-color-picker-dropdown?

Run npx skills add https://github.com/syncfusion/winforms-ui-components-skills --skill syncfusion-winforms-color-picker-dropdown in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/syncfusion-winforms-color-picker-dropdown/ (personal) or .claude/skills/syncfusion-winforms-color-picker-dropdown/ (project).

by syncfusionFrontend & Design

Implement and customize the Syncfusion Windows Forms ColorPickerButton control for color selection. Trigger when user needs a color picker dropdown, color selection UI, color input control, or needs to let users select from color groups (standard, system, custom, user colors). Covers getting started, color selection, customization, and UI appearance properties.

Installs: 79
Last 24h: —
Trending rank: —
Security: Not audited

Install

Works with every agent the skills CLI supports.

npx skills add https://github.com/syncfusion/winforms-ui-components-skills --skill syncfusion-winforms-color-picker-dropdown

01
Install
Run the command in your project. The CLI asks which agents to install for.
02
Describe the task
Ask your agent for something this skill covers. It loads syncfusion-winforms-color-picker-dropdown automatically when relevant.
03
Review the result
The agent follows the SKILL.md steps, scripts and references bundled with the skill.

SKILL.md

The instructions your agent reads when the skill is triggered.

Implementing ColorPickerButton

The ColorPickerButton is a Windows Forms control that displays a dropdown with the ColorUIControl, allowing users to select colors from predefined groups (Standard, System, Custom, and User colors). It combines a button with a professional color picker interface similar to Visual Studio's color picker.

When to Use This Skill

User needs a color picker dropdown control in a Windows Forms application
Implementing color selection UI with multiple color groups
Customizing button appearance to reflect selected colors
Integrating color input into forms without a full dialog
Displaying colors inline within application layouts

Component Overview

The ColorPickerButton provides:

Multiple Color Groups: Standard, System, Custom, and User color options
Color Selection: Interactive color picking with programmatic access
Button Integration: Displays colors on the button face or as text
Dropdown Customization: Adjustable ColorUIControl size and appearance
Easy Integration: Works in designer and programmatic code

Documentation and Navigation Guide

Getting Started

📄 Read: references/getting-started.md

Assembly deployment and NuGet setup
Adding via Visual Studio designer
Adding via code programmatically
Creating and initializing instances
Testing the component

Color Selection & Groups

📄 Read: references/color-selection.md

Selecting colors programmatically and interactively
Working with color groups (SystemColors, StandardColors, CustomColors, UserColors)
Setting initial selected color and group
Color change events and handling
Getting selected color at runtime

Customization Settings

📄 Read: references/customization.md

Sizing the dropdown ColorUIControl
Button appearance properties
Display selected color as button background
Display selected color as button text
Advanced customization and styling

UI Appearance Properties

📄 Read: references/ui-properties.md

Button text, size, and positioning
Color display modes and appearance
Component properties and events
Border and styling
Layout and docking

Quick Start Example

using Syncfusion.Windows.Forms;

public class ColorPickerForm : Form
{
    public ColorPickerForm()
    {
        // Create ColorPickerButton instance
        var colorPicker = new ColorPickerButton();
        colorPicker.Text = "Select a Color";
        colorPicker.Location = new System.Drawing.Point(10, 10);
        colorPicker.Size = new System.Drawing.Size(150, 30);
        
        // Set initial selected color and group
        colorPicker.SelectedColor = System.Drawing.Color.Red;
        colorPicker.SelectedColorGroup = Syncfusion.Windows.Forms.ColorUISelectedGroup.StandardColors;
        
        // Add to form
        this.Controls.Add(colorPicker);
        
        // Set initial form properties
        this.Text = "ColorPickerButton Demo";
        this.Size = new System.Drawing.Size(400, 300);
    }
}

Common Patterns

Pattern 1: Display Selected Color as Button Background

colorPickerButton1.SelectedAsBackcolor = true;
colorPickerButton1.SelectedColor = System.Drawing.Color.OrangeRed;
// Button background now shows the selected color

Pattern 2: Display Selected Color as Text

colorPickerButton1.SelectedAsText = true;
colorPickerButton1.SelectedColor = System.Drawing.Color.Blue;
// Button text displays the selected color name/value

Pattern 3: Set Color Group and Color

colorPickerButton1.SelectedColorGroup = Syncfusion.Windows.Forms.ColorUISelectedGroup.StandardColors;
colorPickerButton1.SelectedColor = System.Drawing.Color.Green;
// Focus the Standard Colors group when dropdown opens

Pattern 4: Customize Dropdown Size

colorPickerButton1.ColorUISize = new System.Drawing.Size(250, 280);
// Adjust dropdown dimensions for your layout

Key Props

Property	Type	Purpose
`SelectedColor`	System.Drawing.Color	Gets/sets the currently selected color
`SelectedColorGroup`	ColorUISelectedGroup	Sets which color group tab is focused (StandardColors, SystemColors, CustomColors, UserColors, None)
`SelectedAsBackcolor`	bool	When true, button background displays the selected color
`SelectedAsText`	bool	When true, button text displays the selected color value
`ColorUISize`	System.Drawing.Size	Gets/sets the size of the dropdown ColorUIControl
`Text`	string	Gets/sets the button text

Common Use Cases

Use Case 1: Theme Color Selector

// Let users pick a theme color that shows on the button
colorPickerButton.SelectedAsBackcolor = true;
colorPickerButton.SelectedColorGroup = ColorUISelectedGroup.StandardColors;

Use Case 2: Color Code Input

// Show selected color value and group
colorPickerButton.SelectedAsText = true;
colorPickerButton.SelectedColorGroup = ColorUISelectedGroup.CustomColors;

Use Case 3: Compact Color Picker

// Minimize space with compact size
colorPickerButton.ColorUISize = new System.Drawing.Size(200, 200);
colorPickerButton.Size = new System.Drawing.Size(80, 25);

Next Steps

Read references/getting-started.md to set up the component
Check references/color-selection.md for color handling
Review references/customization.md for styling options
See references/ui-properties.md for appearance control

FAQ

What does the syncfusion-winforms-color-picker-dropdown skill do?

How do I install syncfusion-winforms-color-picker-dropdown?

Run npx skills add https://github.com/syncfusion/winforms-ui-components-skills --skill syncfusion-winforms-color-picker-dropdown in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/syncfusion-winforms-color-picker-dropdown/ (personal) or .claude/skills/syncfusion-winforms-color-picker-dropdown/ (project).

Which AI agents can use syncfusion-winforms-color-picker-dropdown?

Any agent that supports the open Agent Skills format (a folder with a SKILL.md file), including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, Windsurf, Cline, OpenCode and more.

Is syncfusion-winforms-color-picker-dropdown safe to install?

No partner security audit is available yet. Skills can run commands and scripts, so read the SKILL.md and any bundled files before installing.

Who maintains syncfusion-winforms-color-picker-dropdown?

It is published by syncfusion in syncfusion/winforms-ui-components-skills. It has 79 recorded installs.