Progress Telerik UI for Blazor

Blazor FlatColorPicker

  • Use the Blazor FlatColorPicker to choose and edit colors through a palette with a predefined set of colors and through a gradient component that renders an HSV canvas. Customize its header and footer and choose the view that best suits your case.
  • This component is part of the largest truly native Blazor component suite - Telerik UI for Blazor designed to perfectly fit in any app’s requirement.
  • The Blazor UI suite also comes with professionally designed themes enabled with a flip of a switch, document processing library, rich docs & demos to help you get started in no time.
Telerik UI for Blazor Suite
Nasa, Visa, Microsoft Fox, Samsung, IBM World Bank Group, Volvo
  • Overview

    The Telerik UI for Blazor FlatColorPicker is used for color editing through gradient and palette views that fully integrate with the ColorGradient and ColorPalette components. The UI component supports value resetting, value reverting and Apply & Cancel buttons for committing to your choice.  
    Telerik UI for Blazor FlatColorPicker-Overview
  • Views

    The FlatColorPicker component has two views you can choose from: 
    • Single Palette – which shows a palette (grid of colors) 
    • Gradient View – which displays sliders and a gradient palette allowing more precise selection  
    Telerik UI for Blazor FlatColorPicker Palette Gradient Views
  • The component comes with a built-in header and footer, which can be easily customized through templates. The header shows a button group for switching between views, clear button, preview & revert color action buttons. The footer displays the action buttons for applying or cancelling changes. You can easily customize both by displaying or removing any of the buttons, depending on your project’s needs. 
    Telerik UI for Blazor FlatColorPicker Configuration
  • Action Buttons

    The component features various action buttons in its header and footer. They can be enabled through the ShowButtons property and change how the value of the component will be updated.  

    For more details, visit our documentation article on FlatColorPicker Action Buttons 

  • Theming

    Style the FlatColorPicker using the three built-in themes and a variety of swatches, including Default (Main Dark, Nordic, Purple), Material (Arctic, Lime Dark, Nova) and Bootstrap (Urban, Vintage, etc.). You can easily customize the available themes with a few lines of CSS or create a new one with the Progress Sass ThemeBuilder application
    Telerik UI for Blazor FlatColorPicker-Theming

Next Steps

Launch demos

See Telerik UI for Blazor in action and check out how much it can do out-of-the-box.

Download free trial

Try Telerik UI for Blazor with dedicated technical support.