bug(m3Theme) Invalid generation of secondar palette with @angular/material:m3Theme

[markusahrweileramcon]

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

When running the command to create a new theme, the secondary color option is ignored an always generating ... cyan?

// Note: Color palettes are generated from primary: #4b8ecf, secondary: #666666, tertiary: #253359
$_palettes: (
  primary: (
    0: #000000,
    10: #001d35,
    20: #003257,
    25: #003e69,
    30: #00497b,
    35: #00558e,
    40: #0062a1,
    50: #2f7bbd,
    60: #4e95d9,
    70: #6cb0f6,
    80: #9ccaff,
    90: #d0e4ff,
    95: #e9f1ff,
    98: #f8f9ff,
    99: #fdfcff,
    100: #ffffff,
  ),
  secondary: (
    0: #000000,
    10: #001f24,
    20: #00363d,
    25: #00424a,
    30: #004f58,
    35: #005b66,
    40: #006874,
    50: #008391,
    60: #00a0b0,
    70: #22bccf,
    80: #4fd8eb,
    90: #97f0ff,
    95: #d0f8ff,
    98: #edfcff,
    99: #f6feff,
    100: #ffffff,
  ),
  tertiary: (
    0: #000000,
    10: #001849,
    20: #002b75,
    25: #103683,
    30: #21428f,
    35: #2f4e9c,
    40: #3c5ba9,
    50: #5674c4,
    60: #718ee0,
    70: #8ba8fc,
    80: #b3c5ff,
    90: #dae1ff,
    95: #eef0ff,
    98: #faf8ff,
    99: #fefbff,
    100: #ffffff,
  ),
  neutral: (
    0: #000000,
    10: #1a1c1e,
    20: #2f3033,
    25: #3a3b3e,
    30: #45474a,
    35: #515255,
    40: #5d5e61,
    50: #76777a,
    60: #909094,
    70: #ababae,
    80: #c6c6ca,
    90: #e2e2e6,
    95: #f1f0f4,
    98: #f9f9fc,
    99: #fdfcff,
    100: #ffffff,
    4: #0d0e11,
    6: #121316,
    12: #1e2022,
    17: #282a2d,
    22: #333538,
    24: #38393c,
    87: #dadadd,
    92: #e8e8eb,
    94: #eeedf1,
    96: #f4f3f7,
  ),
  neutral-variant: (
    0: #000000,
    10: #171c22,
    20: #2c3137,
    25: #373c42,
    30: #42474e,
    35: #4e535a,
    40: #5a5f66,
    50: #73777f,
    60: #8c9199,
    70: #a7abb3,
    80: #c2c7cf,
    90: #dfe3eb,
    95: #edf1f9,
    98: #f8f9ff,
    99: #fdfcff,
    100: #ffffff,
  ),
  error: (
    0: #000000,
    10: #410002,
    20: #690005,
    25: #7e0007,
    30: #93000a,
    35: #a80710,
    40: #ba1a1a,
    50: #de3730,
    60: #ff5449,
    70: #ff897d,
    80: #ffb4ab,
    90: #ffdad6,
    95: #ffedea,
    98: #fff8f7,
    99: #fffbff,
    100: #ffffff,
  ),
);

Reproduction

StackBlitz link:
Steps to reproduce:
1.
2.

Expected Behavior

It should have created a color palette for #666666

Actual Behavior

It created a color palette for cyan

Environment

Angular CLI: 18.0.2
Node: 20.9.0
Package Manager: npm 10.1.0
OS: win32 x64

Angular: 18.0.1
... animations, cdk, common, compiler, compiler-cli, core, forms
... language-service, localize, material, platform-browser
... platform-browser-dynamic, platform-server, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1800.2
@angular-devkit/build-angular   18.0.2
@angular-devkit/core            18.0.2
@angular-devkit/schematics      18.0.2
@angular/cli                    18.0.2
@schematics/angular             18.0.2
rxjs                            7.8.1
typescript                      5.4.5
zone.js                         0.14.6

[kamilcglr]

Hi @markusahrweileramcon I have the same problem. I set the tertiary colour but it does not apply in my generated theme. Have you found a solution?

[markusahrweileramcon]

@kamilcglr no, I have created the palette with online tools. Can't remember which and my browser keeps updating the history page, so it's scrolling all the way up and removing older entries added by scrolling.....

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}