background

UI for Blazor

Blazor ColorPalette

  • Use the Blazor ColorPalette component to render colors by using sets of predefined colors or a custom color palette.
  • Part of the Telerik UI for Blazor library along with 110+ professionally-designed UI components.
  • Includes support, documentation, demos, virtual classrooms, Visual Studio Code Extensions and more!
Telerik UI for Blazor ColorPalette - Header
  • Play with Colors with Blazor ColorPalette

    The Telerik UI for Blazor ColorPalette is a versatile color selection tool with customizable dimensions, colors to choose from and styling. Add a sprinkle of validation and keyboard navigation and you have a quality component to be used across your application. 

    See the Blazor ColorPalette Demo
    Telerik UI for Blazor ColorPalette
  • Layout and Customization

    The ColorPalette displays the user with a grid of colors each aspect of which is customizable. You can provide a list of CSS colors (so any combination of RGB(A), HSL(A), hex or CSS names is valid). If you don’t have a concrete set of colors in mind, pick one of the predefined color palettes. The number of rows and columns of the grid and the size of each tile can be specified as well. Thanks to this you can make big single-row or single-column setups when you only need a handful of colors or large selection of tiny tiles. 
    Telerik UI for Blazor ColorPalette
  • Validation

    The component fits neatly in the validation system of Telerik UI for Blazor and you can use the standard validation attributes in your model to specify the constraints for the input e.g. by making the input required. 

    Learn more about the Blazor ColorPalette Validation
  • Keyboard Navigation

    Users can navigate the palette using the arrow keys and select the desired color by pressing Enter – neither of these requires any explanation and it’s only natural for any users to try to work with these keys. 
    Telerik UI for Blazor Keyboard Navigation
  • Right-to-Left (RTL) Support

    The Telerik UI for Blazor ColorPalette component supports right-to-left configuration. The RTL functionality is supported by most of our components to accommodate users who communicate in a right-to-left language script, such as Arabic and Hebrew.

    Learn more in our Blazor Right-to-Left Support documentation 

    Blazor RTL Support

All Blazor Components

Next Steps