NoColor is only compatible with the palette mode

[Julien Barach]

Hi,

Could you make the NoColor option compatible with the Picker mode ?

Currently NoColor is only supported with the Palette mode, which is more limited to select a color.

Could be great to have the NoColor supported in both mode.

Regards,

Julien

[Saranya Dhayalan]

Hi Julien Barach,

In Syncfusion Blazor's ColorPicker, the NoColor option is currently only available in Palette mode, not in Picker mode, which provides more advanced features like hue and saturation sliders. While there's no built-in support for NoColor in Picker mode yet, you can achieve similar functionality with a simple workaround.

You can either set the color value to "#00000000" (representing a fully transparent color as the value in Picker mode to simulate the NoColor behavior — as demonstrated in the GIF below.

You can also achieve the NoColor functionality through a button click. In the button’s click event, simply set the ColorPicker's value to “00000000". This effectively simulates the NoColor option even when using Picker mode.

<SfColorPicker @bind-Value="@colorValue" Mode="ColorPickerMode.Picker" ShowButtons="true">

</SfColorPicker>

 

<button class="e-btn e-flat e-primary mt-2" @onclick="SetNoColor">No Color</button>

 

<p>Selected Color: @DisplayColor</p>

 

@code {

    private string colorValue = "#f44336"; // default color

 

    private void SetNoColor()

    {

        colorValue = "#00000000";

    }

 

    private string DisplayColor => colorValue ?? "No Color";

}

Sample link - https://blazorplayground.syncfusion.com/embed/rZVejpswJJNgQcql?appbar=true&editor=true&result=true&errorlist=true&theme=bootstrap5

Regards,

Saranya D

[Julien Barach]

Hi,

That's not ideal for at least two reasons :

• I store the data on 7 characters (e.g. #ffffff) so I would need to check transparency to know if this is a "no color"
  
• The end user have to know that transparent is "no color". That's not user friendly.

The NoColor option on the Palette mode set string.Empty so it needs no special treatment to store it.

Ideally you need to support NoColor on the picker mode, otherwise I need to build a wrapper component that adds a "No color" button, but that should be supported on your side.

Regards.

[Mallesh Ravi Chandran]

Hi Julien , 

We would like to inform you that the NoColor option is currently supported only in Palette mode. In Picker mode, users can achieve a similar effect by sliding the alpha (transparency) slider to make the color fully transparent, which effectively acts as a "no color" option.

Currently, Picker mode is designed for continuous color selection and does not support additional fixed-value entries like a "NoColor" button. Supporting this would require significant structural changes to how the picker renders its UI and manages value storage.

 

Regards, 
Mallesh