Skip to content

bug(card): align card appearance with m3 specs #29840

Closed
@MikaStark

Description

@MikaStark

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

Hi Angular Material Team !
Thanks for all your hard work on this project.
Today I want to pointout the Material 3 specification for cards mention 3 differents appearance :

That's why I proposed to add a new filled appearance to the existing ones and rename raised into elevated.

I understand this is a very small and easy-to-workaround issue but it would be nice to have a better alignement with Material 3 specs and prevent developers to add extra (yet tiny) style code to get the expected appearance.

Reproduction

StackBlitz link: https://stackblitz.com/edit/zkkqyi?file=src%2Fexample%2Fcard-footer-example.css

Expected Behavior

Having 3 appearance for cards : outlined, elevated and filled

Actual Behavior

  • Missing filled appearance
  • elevated appearance is instead named raised

Environment

  • Angular: 18.2.7
  • CDK/Material: 18.2.7
  • Browser(s): Chrome
  • Operating System (e.g. Windows, macOS, Ubuntu): Ubuntu 24.04

Metadata

Metadata

Assignees

No one assigned

    Labels

    P3An issue that is relevant to core functions, but does not impede progress. Important, but not urgentarea: material/card

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions