In angular material color palettes (such as $mat-indigo or $mat-pink), what are A100, A200, A400, and A700 used for?

Question

Here is an example of an angular-material color palette

$bv-brand: (
    50: #ffffff,
    100: #dde6f3,
    200: #b4c9e4,
    300: #7fa3d1,
    400: #6992c9,
    500: #5282c1,
    600: #4072b4,
    700: #38649d,
    800: #305687,
    900: #284770,
    A100: #ffffff,
    A200: #dde6f3,
    A400: #6992c9,
    A700: #38649d,
    contrast: (
        50: $black-87-opacity,
        100: $black-87-opacity,
        200: $black-87-opacity,
        300: $black-87-opacity,
        400: $black-87-opacity,
        500: white,
        600: white,
        700: white,
        800: white,
        900: white,
        A100: $black-87-opacity,
        A200: $black-87-opacity,
        A400: $black-87-opacity,
        A700: white,
    )
);

I know that the values 50-900 are used for different shades of angular-material components, are the A100-700 values used similarly? What are the values with the leading 'A' used for?

Answer 1

The 'A' indicates "accent" - the hues A100, A200, and A300 are used by the "prebuilt" themes included with Angular Material for the accent color palette. But this is merely what they have chosen to do. There is no "standard" for this - when creating your own theme you are free to use any of the hues in the palette. The only thing that truly matters is the hue indexes that you specify in your mat-palette() call for the 'default', 'lighter', and 'darker' options. By default (i.e. when not specified), the keys '500', '100', and '700' respectively are used.