Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

mat-checkbox: Change size to 18x18 to match Material Design Guidelines #17656

ryan-neufeld opened this issue Nov 8, 2019 · 1 comment


Copy link

@ryan-neufeld ryan-neufeld commented Nov 8, 2019

Bug, feature request, or proposal:

Change checkbox dimensions to 18x18 (14px x 14px + 2px border)

What is the expected behavior?

Both Material Designs Guidlines and Material Designs Sketch UI Kit show the default size of a checkbox as 18x18 (14x14 + 2px border) upon inspecting the code.

What is the current behavior?

Currently, mat-checkbox is 16x16 (12px x 12px + 2px).

What are the steps to reproduce?

StackBlitz starter:

Open inspect element on any live example of the component, class="mat-checkbox-frame" contains the border.

What is the use-case or motivation for changing an existing behavior?

Consistency across Material Design implementations.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?


Is there anything else we should know?



This comment has been minimized.

Copy link

@jelbourn jelbourn commented Nov 12, 2019

This will be fixed by the MDC-based implementation of mat-checkbox

@jelbourn jelbourn added the P4 label Nov 12, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
None yet
2 participants
You can’t perform that action at this time.