Progress Telerik UI for Blazor
Blazor ColorGradient
- Use the Blazor ColorGradient to customize colors through gradient canvases, hue and alpha sliders and editors for HEX and RGB values. Configure its opacity and formats and take advantage of the built-in keyboard navigation support.
- 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.
-
Overview
The Telerik UI for Blazor ColorGradient component allows you to customize color content through a HSVA canvas configurator, which includes a gradient canvas, hue and alpha sliders. You can input colors in the most popular formats, HEX and RGBA. The component is easy to configure, comes with built-in support for keyboard navigation and is compliant with accessibility standards.
-
Choosing Color
Users can choose the color they want by utilizing the canvas, the sliders or the numeric editors. They can use all three to explore the different options and find the one that best suits their case. -
Configuration
You have full control over the ColorGradient component rendering. You can toggle the opacity slider, include both HEX and RGB formats, just one of them or none.
The ColorGradient can be customized through three parameters:
- Opacity
- Format
- Formats (HEX or RGB)
-
Accessibility
The ColorGradient component is compliant with WCAG contrast ratio, thus, you can rest assured that it is accessible to all users.
-
Keyboard Navigation
The component comes with built-in support for keyboard navigation, allowing users to navigate the canvas, sliders and numeric editors with their keyboard.
-
Theming
The Telerik UI for Blazor ColorGradient comes with 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.
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.