Skip to content

Add new parameter to "themeQuartz" #15

@arthurchtdSpark

Description

@arthurchtdSpark

Hello !

Currently, it's possible to customize the color of checkboxes in the Grid, which is great. However, it would be very useful to have a way to configure the color of selection borders, focus outlines, and other related UI highlights in a unified way.

AG Grid already supports this with a the parameter "accentColor" (https://www.ag-grid.com/javascript-data-grid/theming-parameters/) in theme configuration, which makes it easy to apply consistent styling to interactive elements such as checkboxes, radio buttons, and focus rings.

Proposal:
Add support for a single configuration option (e.g., Emphasis color) at the "Styles" section, which applies to:

  • Checkbox selection color
  • Shadow when selection
  • Focus outlines on interactive elements
  • Any other accent/highlight elements in the grid

Benefits:

  • Maintains visual consistency across all UI components inside the grid
  • Simplifies theming and customization (fewer parameters to fill in)
  • Improves accessibility by making selected states more visible and coherent with the brand or app color palette

I've implemented it on a custom component but thought it might be nice to share the info with you :) (here's a video showing it: loom)

Thanks!

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions