diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-dark-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-dark-colorblind-linux.png
new file mode 100644
index 00000000000..4d46967ddff
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-dark-dimmed-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-dark-dimmed-linux.png
new file mode 100644
index 00000000000..7c279cae7cf
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-dark-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..269fa7e9bc1
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-dark-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-dark-linux.png
new file mode 100644
index 00000000000..aafe2d94635
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-dark-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-dark-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..aafe2d94635
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-light-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-light-colorblind-linux.png
new file mode 100644
index 00000000000..768d375e76f
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-light-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-light-high-contrast-linux.png
new file mode 100644
index 00000000000..a51421a63d0
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-light-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-light-linux.png
new file mode 100644
index 00000000000..a9478d40c75
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-light-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-light-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-light-tritanopia-linux.png
new file mode 100644
index 00000000000..a9478d40c75
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Danger-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-dark-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-dark-colorblind-linux.png
new file mode 100644
index 00000000000..09fca2c6b20
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-dark-dimmed-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-dark-dimmed-linux.png
new file mode 100644
index 00000000000..80e8ad1fcac
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-dark-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..2b7eecc23d7
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-dark-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-dark-linux.png
new file mode 100644
index 00000000000..09fca2c6b20
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-dark-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-dark-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..09fca2c6b20
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-light-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-light-colorblind-linux.png
new file mode 100644
index 00000000000..9a6e7d2477b
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-light-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-light-high-contrast-linux.png
new file mode 100644
index 00000000000..27bffd473f7
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-light-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-light-linux.png
new file mode 100644
index 00000000000..9a6e7d2477b
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-light-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-light-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-light-tritanopia-linux.png
new file mode 100644
index 00000000000..9a6e7d2477b
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Default-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-dark-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-dark-colorblind-linux.png
new file mode 100644
index 00000000000..0f679e807c0
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-dark-dimmed-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-dark-dimmed-linux.png
new file mode 100644
index 00000000000..126f95d553b
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-dark-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..7e6709c4fa9
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-dark-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-dark-linux.png
new file mode 100644
index 00000000000..0f679e807c0
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-dark-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-dark-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..0f679e807c0
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-light-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-light-colorblind-linux.png
new file mode 100644
index 00000000000..c05ad07b61e
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-light-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-light-high-contrast-linux.png
new file mode 100644
index 00000000000..08d492a3a67
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-light-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-light-linux.png
new file mode 100644
index 00000000000..c05ad07b61e
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-light-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-light-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-light-tritanopia-linux.png
new file mode 100644
index 00000000000..c05ad07b61e
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Disabled-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-dark-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-dark-colorblind-linux.png
new file mode 100644
index 00000000000..6da539b28fd
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-dark-dimmed-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-dark-dimmed-linux.png
new file mode 100644
index 00000000000..e0bf05aa9e6
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-dark-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..b79bdd43ac2
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-dark-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-dark-linux.png
new file mode 100644
index 00000000000..6da539b28fd
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-dark-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-dark-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..6da539b28fd
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-light-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-light-colorblind-linux.png
new file mode 100644
index 00000000000..d45ffd005a8
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-light-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-light-high-contrast-linux.png
new file mode 100644
index 00000000000..c5d60926a9f
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-light-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-light-linux.png
new file mode 100644
index 00000000000..d45ffd005a8
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-light-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-light-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-light-tritanopia-linux.png
new file mode 100644
index 00000000000..d45ffd005a8
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-dark-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-dark-colorblind-linux.png
new file mode 100644
index 00000000000..40a0c859db8
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-dark-dimmed-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-dark-dimmed-linux.png
new file mode 100644
index 00000000000..ca1b5b17751
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-dark-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..5f38391c8cc
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-dark-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-dark-linux.png
new file mode 100644
index 00000000000..40a0c859db8
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-dark-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-dark-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..40a0c859db8
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-light-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-light-colorblind-linux.png
new file mode 100644
index 00000000000..6970fb25932
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-light-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-light-high-contrast-linux.png
new file mode 100644
index 00000000000..f073bec60e3
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-light-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-light-linux.png
new file mode 100644
index 00000000000..6970fb25932
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-light-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-light-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-light-tritanopia-linux.png
new file mode 100644
index 00000000000..6970fb25932
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Large-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-dark-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-dark-colorblind-linux.png
new file mode 100644
index 00000000000..bcb81af0467
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-dark-dimmed-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-dark-dimmed-linux.png
new file mode 100644
index 00000000000..9ff68751dab
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-dark-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..b79587f4afe
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-dark-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-dark-linux.png
new file mode 100644
index 00000000000..bcb81af0467
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-dark-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-dark-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..bcb81af0467
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-light-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-light-colorblind-linux.png
new file mode 100644
index 00000000000..093d2de4152
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-light-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-light-high-contrast-linux.png
new file mode 100644
index 00000000000..fc2901cc27b
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-light-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-light-linux.png
new file mode 100644
index 00000000000..093d2de4152
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-light-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-light-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-light-tritanopia-linux.png
new file mode 100644
index 00000000000..093d2de4152
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Leading-Visual-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-dark-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-dark-colorblind-linux.png
new file mode 100644
index 00000000000..09fca2c6b20
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-dark-dimmed-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-dark-dimmed-linux.png
new file mode 100644
index 00000000000..80e8ad1fcac
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-dark-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..2b7eecc23d7
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-dark-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-dark-linux.png
new file mode 100644
index 00000000000..09fca2c6b20
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-dark-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-dark-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..09fca2c6b20
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-light-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-light-colorblind-linux.png
new file mode 100644
index 00000000000..9a6e7d2477b
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-light-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-light-high-contrast-linux.png
new file mode 100644
index 00000000000..27bffd473f7
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-light-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-light-linux.png
new file mode 100644
index 00000000000..9a6e7d2477b
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-light-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-light-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-light-tritanopia-linux.png
new file mode 100644
index 00000000000..9a6e7d2477b
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Medium-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-dark-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-dark-colorblind-linux.png
new file mode 100644
index 00000000000..37a4bdfe8be
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-dark-dimmed-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-dark-dimmed-linux.png
new file mode 100644
index 00000000000..e4081923124
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-dark-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..379f2bd5aa1
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-dark-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-dark-linux.png
new file mode 100644
index 00000000000..37a4bdfe8be
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-dark-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-dark-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..37a4bdfe8be
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-light-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-light-colorblind-linux.png
new file mode 100644
index 00000000000..9893ec21912
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-light-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-light-high-contrast-linux.png
new file mode 100644
index 00000000000..e4cdf292d82
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-light-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-light-linux.png
new file mode 100644
index 00000000000..9893ec21912
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-light-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-light-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-light-tritanopia-linux.png
new file mode 100644
index 00000000000..9893ec21912
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Outline-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-dark-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-dark-colorblind-linux.png
new file mode 100644
index 00000000000..09fca2c6b20
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-dark-dimmed-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-dark-dimmed-linux.png
new file mode 100644
index 00000000000..80e8ad1fcac
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-dark-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..2b7eecc23d7
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-dark-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-dark-linux.png
new file mode 100644
index 00000000000..09fca2c6b20
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-dark-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-dark-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..09fca2c6b20
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-light-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-light-colorblind-linux.png
new file mode 100644
index 00000000000..9a6e7d2477b
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-light-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-light-high-contrast-linux.png
new file mode 100644
index 00000000000..27bffd473f7
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-light-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-light-linux.png
new file mode 100644
index 00000000000..9a6e7d2477b
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-light-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-light-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-light-tritanopia-linux.png
new file mode 100644
index 00000000000..9a6e7d2477b
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Playground-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-dark-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-dark-colorblind-linux.png
new file mode 100644
index 00000000000..0163734217f
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-dark-dimmed-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-dark-dimmed-linux.png
new file mode 100644
index 00000000000..549458e0684
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-dark-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..baa9f12ddb8
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-dark-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-dark-linux.png
new file mode 100644
index 00000000000..9b4f6a6ddcd
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-dark-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-dark-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..0163734217f
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-light-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-light-colorblind-linux.png
new file mode 100644
index 00000000000..e1f9cc0742e
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-light-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-light-high-contrast-linux.png
new file mode 100644
index 00000000000..22cca92d77c
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-light-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-light-linux.png
new file mode 100644
index 00000000000..244bcebe27f
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-light-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-light-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-light-tritanopia-linux.png
new file mode 100644
index 00000000000..e1f9cc0742e
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Primary-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-dark-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-dark-colorblind-linux.png
new file mode 100644
index 00000000000..6a72a96baf1
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-dark-dimmed-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-dark-dimmed-linux.png
new file mode 100644
index 00000000000..a52a6610793
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-dark-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..a722086fbdd
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-dark-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-dark-linux.png
new file mode 100644
index 00000000000..6a72a96baf1
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-dark-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-dark-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..6a72a96baf1
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-light-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-light-colorblind-linux.png
new file mode 100644
index 00000000000..0bffaa41c89
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-light-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-light-high-contrast-linux.png
new file mode 100644
index 00000000000..c469395bc1d
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-light-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-light-linux.png
new file mode 100644
index 00000000000..0bffaa41c89
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-light-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-light-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-light-tritanopia-linux.png
new file mode 100644
index 00000000000..0bffaa41c89
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Small-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-dark-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-dark-colorblind-linux.png
new file mode 100644
index 00000000000..dcb7e013f1d
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-dark-dimmed-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-dark-dimmed-linux.png
new file mode 100644
index 00000000000..b5acd817e88
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-dark-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..20db6851f7c
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-dark-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-dark-linux.png
new file mode 100644
index 00000000000..dcb7e013f1d
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-dark-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-dark-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..dcb7e013f1d
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-light-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-light-colorblind-linux.png
new file mode 100644
index 00000000000..e8108858328
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-light-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-light-high-contrast-linux.png
new file mode 100644
index 00000000000..d9643b3ea56
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-light-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-light-linux.png
new file mode 100644
index 00000000000..e8108858328
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-light-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-light-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-light-tritanopia-linux.png
new file mode 100644
index 00000000000..e8108858328
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Counter-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-dark-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-dark-colorblind-linux.png
new file mode 100644
index 00000000000..6b6c693667c
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-dark-dimmed-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-dark-dimmed-linux.png
new file mode 100644
index 00000000000..4fb4f267546
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-dark-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..aebe0f9fcc6
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-dark-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-dark-linux.png
new file mode 100644
index 00000000000..6b6c693667c
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-dark-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-dark-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..6b6c693667c
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-light-colorblind-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-light-colorblind-linux.png
new file mode 100644
index 00000000000..6c68fb0861b
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-light-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-light-high-contrast-linux.png
new file mode 100644
index 00000000000..966331ec746
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-light-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-light-linux.png
new file mode 100644
index 00000000000..6c68fb0861b
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-light-linux.png differ
diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-light-tritanopia-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-light-tritanopia-linux.png
new file mode 100644
index 00000000000..6c68fb0861b
Binary files /dev/null and b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Trailing-Visual-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-dark-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-dark-colorblind-linux.png
new file mode 100644
index 00000000000..433609dca4d
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-dark-dimmed-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-dark-dimmed-linux.png
new file mode 100644
index 00000000000..120aa345f9f
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-dark-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..ff5034030b4
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-dark-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-dark-linux.png
new file mode 100644
index 00000000000..1c46911a8b7
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-dark-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-dark-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..1c46911a8b7
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-light-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-light-colorblind-linux.png
new file mode 100644
index 00000000000..4308eaffc14
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-light-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-light-high-contrast-linux.png
new file mode 100644
index 00000000000..fea7b78c2ab
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-light-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-light-linux.png
new file mode 100644
index 00000000000..b784eb66ff2
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-light-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-light-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-light-tritanopia-linux.png
new file mode 100644
index 00000000000..b784eb66ff2
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Danger-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-dark-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-dark-colorblind-linux.png
new file mode 100644
index 00000000000..f7c84f36e51
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-dark-dimmed-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-dark-dimmed-linux.png
new file mode 100644
index 00000000000..4b37bcd228c
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-dark-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..d1a17b9413e
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-dark-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-dark-linux.png
new file mode 100644
index 00000000000..f7c84f36e51
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-dark-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-dark-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..f7c84f36e51
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-light-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-light-colorblind-linux.png
new file mode 100644
index 00000000000..4f122c9dc18
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-light-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-light-high-contrast-linux.png
new file mode 100644
index 00000000000..5e39ccd261b
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-light-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-light-linux.png
new file mode 100644
index 00000000000..4f122c9dc18
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-light-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-light-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-light-tritanopia-linux.png
new file mode 100644
index 00000000000..4f122c9dc18
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Default-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-dark-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-dark-colorblind-linux.png
new file mode 100644
index 00000000000..3ecad5da83f
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-dark-dimmed-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-dark-dimmed-linux.png
new file mode 100644
index 00000000000..c35373ffcb5
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-dark-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..21a7ebe4abb
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-dark-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-dark-linux.png
new file mode 100644
index 00000000000..3ecad5da83f
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-dark-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-dark-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..3ecad5da83f
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-light-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-light-colorblind-linux.png
new file mode 100644
index 00000000000..4effbfa23a5
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-light-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-light-high-contrast-linux.png
new file mode 100644
index 00000000000..1a3cceaa3bf
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-light-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-light-linux.png
new file mode 100644
index 00000000000..4effbfa23a5
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-light-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-light-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-light-tritanopia-linux.png
new file mode 100644
index 00000000000..4effbfa23a5
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Disabled-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-dark-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-dark-colorblind-linux.png
new file mode 100644
index 00000000000..706caa8285a
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-dark-dimmed-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-dark-dimmed-linux.png
new file mode 100644
index 00000000000..cae151129dd
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-dark-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..60c491f81b7
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-dark-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-dark-linux.png
new file mode 100644
index 00000000000..706caa8285a
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-dark-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-dark-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..706caa8285a
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-light-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-light-colorblind-linux.png
new file mode 100644
index 00000000000..6f38300c227
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-light-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-light-high-contrast-linux.png
new file mode 100644
index 00000000000..88d04cb1f5b
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-light-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-light-linux.png
new file mode 100644
index 00000000000..6f38300c227
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-light-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-light-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-light-tritanopia-linux.png
new file mode 100644
index 00000000000..6f38300c227
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Invisible-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-dark-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-dark-colorblind-linux.png
new file mode 100644
index 00000000000..98c36810154
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-dark-dimmed-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-dark-dimmed-linux.png
new file mode 100644
index 00000000000..fa494b8694f
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-dark-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..77d4d3b0e1c
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-dark-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-dark-linux.png
new file mode 100644
index 00000000000..98c36810154
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-dark-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-dark-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..98c36810154
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-light-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-light-colorblind-linux.png
new file mode 100644
index 00000000000..7def6954541
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-light-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-light-high-contrast-linux.png
new file mode 100644
index 00000000000..704b01b094d
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-light-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-light-linux.png
new file mode 100644
index 00000000000..7def6954541
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-light-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-light-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-light-tritanopia-linux.png
new file mode 100644
index 00000000000..7def6954541
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Large-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-dark-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-dark-colorblind-linux.png
new file mode 100644
index 00000000000..f7c84f36e51
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-dark-dimmed-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-dark-dimmed-linux.png
new file mode 100644
index 00000000000..4b37bcd228c
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-dark-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..d1a17b9413e
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-dark-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-dark-linux.png
new file mode 100644
index 00000000000..f7c84f36e51
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-dark-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-dark-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..f7c84f36e51
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-light-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-light-colorblind-linux.png
new file mode 100644
index 00000000000..4f122c9dc18
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-light-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-light-high-contrast-linux.png
new file mode 100644
index 00000000000..5e39ccd261b
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-light-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-light-linux.png
new file mode 100644
index 00000000000..4f122c9dc18
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-light-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-light-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-light-tritanopia-linux.png
new file mode 100644
index 00000000000..4f122c9dc18
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Medium-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-colorblind-linux.png
new file mode 100644
index 00000000000..731730d9667
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-dimmed-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-dimmed-linux.png
new file mode 100644
index 00000000000..254594eaadd
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..b000d2bc440
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-linux.png
new file mode 100644
index 00000000000..731730d9667
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..731730d9667
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-light-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-light-colorblind-linux.png
new file mode 100644
index 00000000000..84d98d97639
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-light-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-light-high-contrast-linux.png
new file mode 100644
index 00000000000..c77dcec1007
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-light-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-light-linux.png
new file mode 100644
index 00000000000..84d98d97639
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-light-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-light-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-light-tritanopia-linux.png
new file mode 100644
index 00000000000..84d98d97639
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-dark-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-dark-colorblind-linux.png
new file mode 100644
index 00000000000..6d9dbbce002
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-dark-dimmed-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-dark-dimmed-linux.png
new file mode 100644
index 00000000000..66e90591a89
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-dark-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..94d314ee459
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-dark-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-dark-linux.png
new file mode 100644
index 00000000000..61de8c65f7b
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-dark-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-dark-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..6d9dbbce002
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-light-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-light-colorblind-linux.png
new file mode 100644
index 00000000000..8c49c3fb0c8
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-light-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-light-high-contrast-linux.png
new file mode 100644
index 00000000000..85322075097
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-light-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-light-linux.png
new file mode 100644
index 00000000000..765bdc62f5d
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-light-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-light-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-light-tritanopia-linux.png
new file mode 100644
index 00000000000..8c49c3fb0c8
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-dark-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-dark-colorblind-linux.png
new file mode 100644
index 00000000000..f5a41634dfc
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-dark-dimmed-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-dark-dimmed-linux.png
new file mode 100644
index 00000000000..19edd517990
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-dark-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..112344da934
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-dark-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-dark-linux.png
new file mode 100644
index 00000000000..f5a41634dfc
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-dark-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-dark-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..f5a41634dfc
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-light-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-light-colorblind-linux.png
new file mode 100644
index 00000000000..503dd559d71
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-light-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-light-high-contrast-linux.png
new file mode 100644
index 00000000000..d73e0b30b8a
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-light-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-light-linux.png
new file mode 100644
index 00000000000..503dd559d71
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-light-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-light-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-light-tritanopia-linux.png
new file mode 100644
index 00000000000..503dd559d71
Binary files /dev/null and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Small-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-dark-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-dark-colorblind-linux.png
new file mode 100644
index 00000000000..8e9a8cefb04
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-dark-dimmed-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-dark-dimmed-linux.png
new file mode 100644
index 00000000000..6efca82d383
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-dark-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..cc36b544690
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-dark-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-dark-linux.png
new file mode 100644
index 00000000000..5540f5e343c
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-dark-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-dark-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..5540f5e343c
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-light-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-light-colorblind-linux.png
new file mode 100644
index 00000000000..2fd09ce5d84
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-light-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-light-high-contrast-linux.png
new file mode 100644
index 00000000000..7581948193a
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-light-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-light-linux.png
new file mode 100644
index 00000000000..19973323ad1
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-light-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-light-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-light-tritanopia-linux.png
new file mode 100644
index 00000000000..19973323ad1
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Danger-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-dark-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-dark-colorblind-linux.png
new file mode 100644
index 00000000000..dc5f0f4b5c1
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-dark-dimmed-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-dark-dimmed-linux.png
new file mode 100644
index 00000000000..e2d54cd3a16
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-dark-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..a4038ddb289
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-dark-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-dark-linux.png
new file mode 100644
index 00000000000..dc5f0f4b5c1
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-dark-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-dark-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..dc5f0f4b5c1
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-light-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-light-colorblind-linux.png
new file mode 100644
index 00000000000..4137438612b
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-light-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-light-high-contrast-linux.png
new file mode 100644
index 00000000000..dbf94992df7
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-light-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-light-linux.png
new file mode 100644
index 00000000000..4137438612b
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-light-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-light-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-light-tritanopia-linux.png
new file mode 100644
index 00000000000..4137438612b
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Default-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-dark-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-dark-colorblind-linux.png
new file mode 100644
index 00000000000..96491afdfc6
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-dark-dimmed-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-dark-dimmed-linux.png
new file mode 100644
index 00000000000..1a11b62dbbe
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-dark-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..36cf32ee771
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-dark-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-dark-linux.png
new file mode 100644
index 00000000000..96491afdfc6
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-dark-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-dark-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..96491afdfc6
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-light-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-light-colorblind-linux.png
new file mode 100644
index 00000000000..3011b428e1f
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-light-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-light-high-contrast-linux.png
new file mode 100644
index 00000000000..d274a98d639
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-light-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-light-linux.png
new file mode 100644
index 00000000000..3011b428e1f
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-light-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-light-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-light-tritanopia-linux.png
new file mode 100644
index 00000000000..3011b428e1f
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-dark-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-dark-colorblind-linux.png
new file mode 100644
index 00000000000..da4f705945e
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-dark-dimmed-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-dark-dimmed-linux.png
new file mode 100644
index 00000000000..15651ab92f0
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-dark-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..60370b7d94c
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-dark-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-dark-linux.png
new file mode 100644
index 00000000000..da4f705945e
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-dark-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-dark-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..da4f705945e
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-light-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-light-colorblind-linux.png
new file mode 100644
index 00000000000..7dee981476c
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-light-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-light-high-contrast-linux.png
new file mode 100644
index 00000000000..ccffbdd3377
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-light-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-light-linux.png
new file mode 100644
index 00000000000..7dee981476c
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-light-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-light-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-light-tritanopia-linux.png
new file mode 100644
index 00000000000..7dee981476c
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Large-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-dark-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-dark-colorblind-linux.png
new file mode 100644
index 00000000000..974631b9b5e
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-dark-dimmed-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-dark-dimmed-linux.png
new file mode 100644
index 00000000000..5cec6060501
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-dark-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..434329e791a
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-dark-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-dark-linux.png
new file mode 100644
index 00000000000..974631b9b5e
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-dark-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-dark-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..974631b9b5e
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-light-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-light-colorblind-linux.png
new file mode 100644
index 00000000000..7f23cee775f
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-light-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-light-high-contrast-linux.png
new file mode 100644
index 00000000000..7a23732c0d9
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-light-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-light-linux.png
new file mode 100644
index 00000000000..7f23cee775f
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-light-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-light-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-light-tritanopia-linux.png
new file mode 100644
index 00000000000..7f23cee775f
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Leading-Visual-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-dark-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-dark-colorblind-linux.png
new file mode 100644
index 00000000000..dc5f0f4b5c1
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-dark-dimmed-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-dark-dimmed-linux.png
new file mode 100644
index 00000000000..e2d54cd3a16
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-dark-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..a4038ddb289
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-dark-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-dark-linux.png
new file mode 100644
index 00000000000..dc5f0f4b5c1
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-dark-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-dark-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..dc5f0f4b5c1
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-light-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-light-colorblind-linux.png
new file mode 100644
index 00000000000..4137438612b
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-light-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-light-high-contrast-linux.png
new file mode 100644
index 00000000000..dbf94992df7
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-light-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-light-linux.png
new file mode 100644
index 00000000000..4137438612b
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-light-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-light-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-light-tritanopia-linux.png
new file mode 100644
index 00000000000..4137438612b
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Medium-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-dark-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-dark-colorblind-linux.png
new file mode 100644
index 00000000000..f66a1116f15
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-dark-dimmed-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-dark-dimmed-linux.png
new file mode 100644
index 00000000000..bcb806c2680
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-dark-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..34917cad01b
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-dark-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-dark-linux.png
new file mode 100644
index 00000000000..f66a1116f15
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-dark-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-dark-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..f66a1116f15
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-light-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-light-colorblind-linux.png
new file mode 100644
index 00000000000..763dfe08f8a
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-light-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-light-high-contrast-linux.png
new file mode 100644
index 00000000000..1405af83ae1
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-light-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-light-linux.png
new file mode 100644
index 00000000000..763dfe08f8a
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-light-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-light-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-light-tritanopia-linux.png
new file mode 100644
index 00000000000..763dfe08f8a
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Outline-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-dark-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-dark-colorblind-linux.png
new file mode 100644
index 00000000000..dc5f0f4b5c1
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-dark-dimmed-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-dark-dimmed-linux.png
new file mode 100644
index 00000000000..e2d54cd3a16
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-dark-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..a4038ddb289
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-dark-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-dark-linux.png
new file mode 100644
index 00000000000..dc5f0f4b5c1
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-dark-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-dark-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..dc5f0f4b5c1
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-light-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-light-colorblind-linux.png
new file mode 100644
index 00000000000..4137438612b
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-light-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-light-high-contrast-linux.png
new file mode 100644
index 00000000000..dbf94992df7
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-light-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-light-linux.png
new file mode 100644
index 00000000000..4137438612b
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-light-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-light-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-light-tritanopia-linux.png
new file mode 100644
index 00000000000..4137438612b
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Playground-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-dark-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-dark-colorblind-linux.png
new file mode 100644
index 00000000000..c60fd519a38
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-dark-dimmed-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-dark-dimmed-linux.png
new file mode 100644
index 00000000000..de981c90608
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-dark-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..8ecb03ad3fd
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-dark-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-dark-linux.png
new file mode 100644
index 00000000000..d808eb30ff6
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-dark-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-dark-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..c60fd519a38
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-light-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-light-colorblind-linux.png
new file mode 100644
index 00000000000..ea5c6a07b7d
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-light-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-light-high-contrast-linux.png
new file mode 100644
index 00000000000..1425e9c6731
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-light-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-light-linux.png
new file mode 100644
index 00000000000..cfdf0ab0ac5
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-light-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-light-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-light-tritanopia-linux.png
new file mode 100644
index 00000000000..ea5c6a07b7d
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Primary-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-dark-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-dark-colorblind-linux.png
new file mode 100644
index 00000000000..c4463f73bd5
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-dark-dimmed-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-dark-dimmed-linux.png
new file mode 100644
index 00000000000..18b733da11d
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-dark-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..809ff437833
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-dark-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-dark-linux.png
new file mode 100644
index 00000000000..c4463f73bd5
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-dark-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-dark-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..c4463f73bd5
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-light-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-light-colorblind-linux.png
new file mode 100644
index 00000000000..c7a6150491a
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-light-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-light-high-contrast-linux.png
new file mode 100644
index 00000000000..f83e48065e0
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-light-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-light-linux.png
new file mode 100644
index 00000000000..c7a6150491a
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-light-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-light-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-light-tritanopia-linux.png
new file mode 100644
index 00000000000..c7a6150491a
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Small-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-dark-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-dark-colorblind-linux.png
new file mode 100644
index 00000000000..4c994c27c07
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-dark-dimmed-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-dark-dimmed-linux.png
new file mode 100644
index 00000000000..5b32af2a158
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-dark-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..f156322a80a
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-dark-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-dark-linux.png
new file mode 100644
index 00000000000..4c994c27c07
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-dark-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-dark-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..4c994c27c07
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-light-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-light-colorblind-linux.png
new file mode 100644
index 00000000000..1a852ff0d7a
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-light-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-light-high-contrast-linux.png
new file mode 100644
index 00000000000..5b15b2b0d93
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-light-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-light-linux.png
new file mode 100644
index 00000000000..1a852ff0d7a
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-light-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-light-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-light-tritanopia-linux.png
new file mode 100644
index 00000000000..1a852ff0d7a
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Trailing-Visual-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-dark-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-dark-colorblind-linux.png
new file mode 100644
index 00000000000..dc5f0f4b5c1
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-dark-dimmed-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-dark-dimmed-linux.png
new file mode 100644
index 00000000000..e2d54cd3a16
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-dark-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-dark-high-contrast-linux.png
new file mode 100644
index 00000000000..a4038ddb289
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-dark-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-dark-linux.png
new file mode 100644
index 00000000000..dc5f0f4b5c1
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-dark-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-dark-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-dark-tritanopia-linux.png
new file mode 100644
index 00000000000..dc5f0f4b5c1
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-light-colorblind-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-light-colorblind-linux.png
new file mode 100644
index 00000000000..4137438612b
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-light-high-contrast-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-light-high-contrast-linux.png
new file mode 100644
index 00000000000..dbf94992df7
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-light-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-light-linux.png
new file mode 100644
index 00000000000..4137438612b
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-light-linux.png differ
diff --git a/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-light-tritanopia-linux.png b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-light-tritanopia-linux.png
new file mode 100644
index 00000000000..4137438612b
Binary files /dev/null and b/.playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-With-React-Router-light-tritanopia-linux.png differ
diff --git a/docs/content/Button.mdx b/docs/content/Button.mdx
index 922ccba6aa8..d6b8b91dd5d 100644
--- a/docs/content/Button.mdx
+++ b/docs/content/Button.mdx
@@ -3,7 +3,7 @@ componentId: button
 title: Button
 status: Alpha
 source: https://github.com/primer/react/tree/main/src/Button
-storybook: '/react/storybook?path=/story/components-button'
+storybook: '/react/storybook?path=/story/components-button--playground'
 description: Use button for the main actions on a page or form.
 ---
 
diff --git a/docs/content/IconButton.mdx b/docs/content/IconButton.mdx
index 49508bcd1f2..13f61a49e09 100644
--- a/docs/content/IconButton.mdx
+++ b/docs/content/IconButton.mdx
@@ -3,7 +3,7 @@ title: IconButton
 componentId: icon_button
 status: Alpha
 source: https://github.com/primer/react/tree/main/src/Button
-storybook: '/react/storybook?path=/story/components-button--icon-button'
+storybook: '/react/storybook?path=/story/components-iconbutton--playground'
 description: An accessible button component with no text and only icon.
 ---
 
diff --git a/e2e/components/Button.test.ts b/e2e/components/Button.test.ts
index 9612329eeaa..7cd8e5f4ff5 100644
--- a/e2e/components/Button.test.ts
+++ b/e2e/components/Button.test.ts
@@ -3,354 +3,445 @@ import {visit} from '../test-helpers/storybook'
 import {themes} from '../test-helpers/themes'
 
 test.describe('Button', () => {
-  test.describe('Default Button', () => {
-    themes.forEach(theme => {
-      test(`${theme} @vrt`, async ({page}) => {
-        await visit(page, {
-          id: 'components-button--default-button',
-          globals: {
-            colorScheme: theme,
-          },
+  test.describe('Playground', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-button--playground',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`Button.Playground.${theme}.png`)
         })
 
-        // Default state
-        expect(await page.screenshot()).toMatchSnapshot(`Default Button.${theme}.png`)
-
-        // Focus state
-        await page.keyboard.press('Tab')
-        expect(await page.screenshot()).toMatchSnapshot(`Default Button.${theme}.focused.png`)
-      })
-    })
-
-    test('axe @aat', async ({page}) => {
-      await visit(page, {
-        id: 'components-button--default-button',
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-button--playground',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
       })
-      await expect(page).toHaveNoViolations()
-    })
+    }
   })
 
-  test.describe('Primary Button', () => {
-    themes.forEach(theme => {
-      test(`${theme} @vrt`, async ({page}) => {
-        await visit(page, {
-          id: 'components-button--primary-button',
-          globals: {
-            colorScheme: theme,
-          },
+  test.describe('Danger', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--danger',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`Button.Danger.${theme}.png`)
         })
 
-        // Default state
-        expect(await page.screenshot()).toMatchSnapshot(`Primary Button.${theme}.png`)
-
-        // Focus state
-        await page.keyboard.press('Tab')
-        expect(await page.screenshot()).toMatchSnapshot(`Primary Button.${theme}.focused.png`)
-      })
-    })
-
-    test.fixme('axe @aat', async ({page}) => {
-      await visit(page, {
-        id: 'components-button--primary-button',
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--danger',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
       })
-      await expect(page).toHaveNoViolations()
-    })
+    }
   })
 
-  test.describe('Danger Button', () => {
-    themes.forEach(theme => {
-      test(`${theme} @vrt`, async ({page}) => {
-        await visit(page, {
-          id: 'components-button--danger-button',
-          globals: {
-            colorScheme: theme,
-          },
+  test.describe('Default', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--default',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`Button.Default.${theme}.png`)
         })
 
-        // Default state
-        expect(await page.screenshot()).toMatchSnapshot(`Danger Button.${theme}.png`)
-
-        // Focus state
-        await page.keyboard.press('Tab')
-        expect(await page.screenshot()).toMatchSnapshot(`Danger Button.${theme}.focused.png`)
-      })
-    })
-
-    test('axe @aat', async ({page}) => {
-      await visit(page, {
-        id: 'components-button--danger-button',
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--default',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
       })
-      await expect(page).toHaveNoViolations()
-    })
+    }
   })
 
-  test.describe('Invisible Button', () => {
-    themes.forEach(theme => {
-      test(`${theme} @vrt`, async ({page}) => {
-        await visit(page, {
-          id: 'components-button--invisible-button',
-          globals: {
-            colorScheme: theme,
-          },
+  test.describe('Disabled', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--disabled',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`Button.Disabled.${theme}.png`)
         })
 
-        // Default state
-        expect(await page.screenshot()).toMatchSnapshot(`Invisible Button.${theme}.png`)
-
-        // Focus state
-        await page.keyboard.press('Tab')
-        expect(await page.screenshot()).toMatchSnapshot(`Invisible Button.${theme}.focused.png`)
-      })
-    })
-
-    test('axe @aat', async ({page}) => {
-      await visit(page, {
-        id: 'components-button--invisible-button',
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--disabled',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
       })
-      await expect(page).toHaveNoViolations()
-    })
+    }
   })
 
-  test.describe('Outline Button', () => {
-    themes.forEach(theme => {
-      test(`${theme} @vrt`, async ({page}) => {
-        await visit(page, {
-          id: 'components-button--outline-button',
-          globals: {
-            colorScheme: theme,
-          },
+  test.describe('Invisible', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--invisible',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`Button.Invisible.${theme}.png`)
         })
 
-        // Default state
-        expect(await page.screenshot()).toMatchSnapshot(`Outline Button.${theme}.png`)
-
-        // Focus state
-        await page.keyboard.press('Tab')
-        expect(await page.screenshot()).toMatchSnapshot(`Outline Button.${theme}.focused.png`)
-      })
-    })
-
-    test('axe @aat', async ({page}) => {
-      await visit(page, {
-        id: 'components-button--outline-button',
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--invisible',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
       })
-      await expect(page).toHaveNoViolations()
-    })
+    }
   })
 
-  test.describe('Icon Before Button', () => {
-    themes.forEach(theme => {
-      test(`${theme} @vrt`, async ({page}) => {
-        await visit(page, {
-          id: 'components-button--icon-before-button',
-          globals: {
-            colorScheme: theme,
-          },
+  test.describe('Large', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--large',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`Button.Large.${theme}.png`)
         })
 
-        // Default state
-        expect(await page.screenshot()).toMatchSnapshot(`Icon Before Button.${theme}.png`)
-
-        // Focus state
-        await page.keyboard.press('Tab')
-        expect(await page.screenshot()).toMatchSnapshot(`Icon Before Button.${theme}.focused.png`)
-      })
-    })
-
-    test('axe @aat', async ({page}) => {
-      await visit(page, {
-        id: 'components-button--icon-before-button',
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--large',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
       })
-      await expect(page).toHaveNoViolations()
-    })
+    }
   })
 
-  test.describe('Icon Button', () => {
-    themes.forEach(theme => {
-      test(`${theme} @vrt`, async ({page}) => {
-        await visit(page, {
-          id: 'components-button--icon-button',
-          globals: {
-            colorScheme: theme,
-          },
+  test.describe('Leading Visual', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--leading-visual',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`Button.Leading Visual.${theme}.png`)
         })
 
-        // Default state
-        expect(await page.screenshot()).toMatchSnapshot(`Icon Button.${theme}.png`)
-
-        // Focus state
-        await page.keyboard.press('Tab')
-        expect(await page.screenshot()).toMatchSnapshot(`Icon Button.${theme}.focused.png`)
-      })
-    })
-
-    test('axe @aat', async ({page}) => {
-      await visit(page, {
-        id: 'components-button--icon-button',
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--leading-visual',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
       })
-      await expect(page).toHaveNoViolations()
-    })
+    }
   })
 
-  test.describe('Watch Counter Button', () => {
-    themes.forEach(theme => {
-      test(`${theme} @vrt`, async ({page}) => {
-        await visit(page, {
-          id: 'components-button--watch-counter-button',
-          globals: {
-            colorScheme: theme,
-          },
+  test.describe('Medium', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--medium',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`Button.Medium.${theme}.png`)
         })
 
-        // Default state
-        expect(await page.screenshot()).toMatchSnapshot(`Watch Counter Button.${theme}.png`)
-
-        // Focus state
-        await page.keyboard.press('Tab')
-        expect(await page.screenshot()).toMatchSnapshot(`Watch Counter Button.${theme}.focused.png`)
-      })
-    })
-
-    test.fixme('axe @aat', async ({page}) => {
-      await visit(page, {
-        id: 'components-button--watch-counter-button',
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--medium',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
       })
-      await expect(page).toHaveNoViolations()
-    })
+    }
   })
 
-  test.describe('Watch Icon Button', () => {
-    themes.forEach(theme => {
-      test(`${theme} @vrt`, async ({page}) => {
-        await visit(page, {
-          id: 'components-button--watch-icon-button',
-          globals: {
-            colorScheme: theme,
-          },
+  test.describe('Outline', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--outline',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`Button.Outline.${theme}.png`)
         })
 
-        // Default state
-        expect(await page.screenshot()).toMatchSnapshot(`Watch Icon Button.${theme}.png`)
-
-        // Focus state
-        await page.keyboard.press('Tab')
-        expect(await page.screenshot()).toMatchSnapshot(`Watch Icon Button.${theme}.focused.png`)
-      })
-    })
-
-    test('axe @aat', async ({page}) => {
-      await visit(page, {
-        id: 'components-button--watch-icon-button',
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--outline',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
       })
-      await expect(page).toHaveNoViolations()
-    })
+    }
   })
 
-  test.describe('Caret Button', () => {
-    themes.forEach(theme => {
-      test(`${theme} @vrt`, async ({page}) => {
-        await visit(page, {
-          id: 'components-button--caret-button',
-          globals: {
-            colorScheme: theme,
-          },
+  test.describe('Primary', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--primary',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`Button.Primary.${theme}.png`)
         })
 
-        // Default state
-        expect(await page.screenshot()).toMatchSnapshot(`Caret Button.${theme}.png`)
-
-        // Focus state
-        await page.keyboard.press('Tab')
-        expect(await page.screenshot()).toMatchSnapshot(`Caret Button.${theme}.focused.png`)
-      })
-    })
-
-    test('axe @aat', async ({page}) => {
-      await visit(page, {
-        id: 'components-button--caret-button',
+        test.fixme('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--primary',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
       })
-      await expect(page).toHaveNoViolations()
-    })
+    }
   })
 
-  test.describe('Block Button', () => {
-    themes.forEach(theme => {
-      test(`${theme} @vrt`, async ({page}) => {
-        await visit(page, {
-          id: 'components-button--block-button',
-          globals: {
-            colorScheme: theme,
-          },
+  test.describe('Small', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--small',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`Button.Small.${theme}.png`)
         })
 
-        // Default state
-        expect(await page.screenshot()).toMatchSnapshot(`Block Button.${theme}.png`)
-
-        // Focus state
-        await page.keyboard.press('Tab')
-        expect(await page.screenshot()).toMatchSnapshot(`Block Button.${theme}.focused.png`)
-      })
-    })
-
-    test('axe @aat', async ({page}) => {
-      await visit(page, {
-        id: 'components-button--block-button',
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--small',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
       })
-      await expect(page).toHaveNoViolations()
-    })
+    }
   })
 
-  test.describe('Disabled Button', () => {
-    themes.forEach(theme => {
-      test(`${theme} @vrt`, async ({page}) => {
-        await visit(page, {
-          id: 'components-button--disabled-button',
-          globals: {
-            colorScheme: theme,
-          },
+  test.describe('Trailing Counter', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--trailing-counter',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`Button.Trailing Counter.${theme}.png`)
         })
 
-        // Default state
-        expect(await page.screenshot()).toMatchSnapshot(`Disabled Button.${theme}.png`)
-
-        // Focus state
-        await page.keyboard.press('Tab')
-        expect(await page.screenshot()).toMatchSnapshot(`Disabled Button.${theme}.focused.png`)
-      })
-    })
-
-    test('axe @aat', async ({page}) => {
-      await visit(page, {
-        id: 'components-button--disabled-button',
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--trailing-counter',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
       })
-      await expect(page).toHaveNoViolations()
-    })
+    }
   })
 
-  test.describe('Link Button', () => {
-    themes.forEach(theme => {
-      test(`${theme} @vrt`, async ({page}) => {
-        await visit(page, {
-          id: 'components-button--link-button',
-          globals: {
-            colorScheme: theme,
-          },
+  test.describe('Trailing Visual', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--trailing-visual',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`Button.Trailing Visual.${theme}.png`)
         })
 
-        // Default state
-        expect(await page.screenshot()).toMatchSnapshot(`Link Button.${theme}.png`)
-
-        // Focus state
-        await page.keyboard.press('Tab')
-        expect(await page.screenshot()).toMatchSnapshot(`Link Button.${theme}.focused.png`)
-      })
-    })
-
-    test.fixme('axe @aat', async ({page}) => {
-      await visit(page, {
-        id: 'components-button--link-button',
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-button-features--trailing-visual',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
       })
-      await expect(page).toHaveNoViolations()
-    })
+    }
   })
 })
diff --git a/e2e/components/IconButton.test.ts b/e2e/components/IconButton.test.ts
new file mode 100644
index 00000000000..988e33d898d
--- /dev/null
+++ b/e2e/components/IconButton.test.ts
@@ -0,0 +1,311 @@
+import {test, expect} from '@playwright/test'
+import {visit} from '../test-helpers/storybook'
+import {themes} from '../test-helpers/themes'
+
+test.describe('IconButton', () => {
+  test.describe('Playground', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-iconbutton--playground',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`IconButton.Playground.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-iconbutton--playground',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+
+  test.describe('Danger', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-iconbutton-features--danger',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`IconButton.Danger.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-iconbutton-features--danger',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+
+  test.describe('Default', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-iconbutton-features--default',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`IconButton.Default.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-iconbutton-features--default',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+
+  test.describe('Disabled', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-iconbutton-features--disabled',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`IconButton.Disabled.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-iconbutton-features--disabled',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+
+  test.describe('Invisible', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-iconbutton-features--invisible',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`IconButton.Invisible.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-iconbutton-features--invisible',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+
+  test.describe('Large', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-iconbutton-features--large',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`IconButton.Large.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-iconbutton-features--large',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+
+  test.describe('Medium', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-iconbutton-features--medium',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`IconButton.Medium.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-iconbutton-features--medium',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+
+  test.describe('Primary', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-iconbutton-features--primary',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`IconButton.Primary.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-iconbutton-features--primary',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+
+  test.describe('Small', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-iconbutton-features--small',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`IconButton.Small.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-iconbutton-features--small',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+})
diff --git a/e2e/components/LinkButton.test.ts b/e2e/components/LinkButton.test.ts
new file mode 100644
index 00000000000..e2e1abd5f63
--- /dev/null
+++ b/e2e/components/LinkButton.test.ts
@@ -0,0 +1,413 @@
+import {test, expect} from '@playwright/test'
+import {visit} from '../test-helpers/storybook'
+import {themes} from '../test-helpers/themes'
+
+test.describe('LinkButton', () => {
+  test.describe('Playground', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton--playground',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`LinkButton.Playground.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton--playground',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+
+  test.describe('Danger', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--danger',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`LinkButton.Danger.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--danger',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+
+  test.describe('Default', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--default',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`LinkButton.Default.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--default',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+
+  test.describe('Invisible', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--invisible',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`LinkButton.Invisible.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--invisible',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+
+  test.describe('Large', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--large',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`LinkButton.Large.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--large',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+
+  test.describe('Leading Visual', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--leading-visual',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`LinkButton.Leading Visual.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--leading-visual',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+
+  test.describe('Medium', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--medium',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`LinkButton.Medium.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--medium',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+
+  test.describe('Outline', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--outline',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`LinkButton.Outline.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--outline',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+
+  test.describe('Primary', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--primary',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`LinkButton.Primary.${theme}.png`)
+        })
+
+        test.fixme('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--primary',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+
+  test.describe('Small', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--small',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`LinkButton.Small.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--small',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+
+  test.describe('Trailing Visual', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--trailing-visual',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`LinkButton.Trailing Visual.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--trailing-visual',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+
+  test.describe('With React Router', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--with-react-router',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`LinkButton.With React Router.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-linkbutton-features--with-react-router',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations({
+            rules: {
+              'color-contrast': {
+                enabled: theme !== 'dark_dimmed',
+              },
+            },
+          })
+        })
+      })
+    }
+  })
+})
diff --git a/script/generate-e2e-tests.js b/script/generate-e2e-tests.js
index 908aeb177e6..6f2776f1e8f 100644
--- a/script/generate-e2e-tests.js
+++ b/script/generate-e2e-tests.js
@@ -71,6 +71,163 @@ const components = new Map([
       ],
     },
   ],
+  [
+    'Button',
+    {
+      stories: [
+        {
+          id: 'components-button--playground',
+          name: 'Playground',
+        },
+        {
+          id: 'components-button-features--danger',
+          name: 'Danger',
+        },
+        {
+          id: 'components-button-features--default',
+          name: 'Default',
+        },
+        {
+          id: 'components-button-features--disabled',
+          name: 'Disabled',
+        },
+        {
+          id: 'components-button-features--invisible',
+          name: 'Invisible',
+        },
+        {
+          id: 'components-button-features--large',
+          name: 'Large',
+        },
+        {
+          id: 'components-button-features--leading-visual',
+          name: 'Leading Visual',
+        },
+        {
+          id: 'components-button-features--medium',
+          name: 'Medium',
+        },
+        {
+          id: 'components-button-features--outline',
+          name: 'Outline',
+        },
+        {
+          id: 'components-button-features--primary',
+          name: 'Primary',
+        },
+        {
+          id: 'components-button-features--small',
+          name: 'Small',
+        },
+        {
+          id: 'components-button-features--trailing-counter',
+          name: 'Trailing Counter',
+        },
+        {
+          id: 'components-button-features--trailing-visual',
+          name: 'Trailing Visual',
+        },
+      ],
+    },
+  ],
+  [
+    'IconButton',
+    {
+      stories: [
+        {
+          id: 'components-iconbutton--playground',
+          name: 'Playground',
+        },
+        {
+          id: 'components-iconbutton-features--danger',
+          name: 'Danger',
+        },
+        {
+          id: 'components-iconbutton-features--default',
+          name: 'Default',
+        },
+        {
+          id: 'components-iconbutton-features--disabled',
+          name: 'Disabled',
+        },
+        {
+          id: 'components-iconbutton-features--invisible',
+          name: 'Invisible',
+        },
+        {
+          id: 'components-iconbutton-features--large',
+          name: 'Large',
+        },
+        {
+          id: 'components-iconbutton-features--medium',
+          name: 'Medium',
+        },
+        {
+          id: 'components-iconbutton-features--primary',
+          name: 'Primary',
+        },
+        {
+          id: 'components-iconbutton-features--small',
+          name: 'Small',
+        },
+      ],
+    },
+  ],
+  [
+    'LinkButton',
+    {
+      stories: [
+        {
+          id: 'components-linkbutton--playground',
+          name: 'Playground',
+        },
+        {
+          id: 'components-linkbutton-features--danger',
+          name: 'Danger',
+        },
+        {
+          id: 'components-linkbutton-features--default',
+          name: 'Default',
+        },
+        {
+          id: 'components-linkbutton-features--invisible',
+          name: 'Invisible',
+        },
+        {
+          id: 'components-linkbutton-features--large',
+          name: 'Large',
+        },
+        {
+          id: 'components-linkbutton-features--leading-visual',
+          name: 'Leading Visual',
+        },
+        {
+          id: 'components-linkbutton-features--medium',
+          name: 'Medium',
+        },
+        {
+          id: 'components-linkbutton-features--outline',
+          name: 'Outline',
+        },
+        {
+          id: 'components-linkbutton-features--primary',
+          name: 'Primary',
+        },
+        {
+          id: 'components-linkbutton-features--small',
+          name: 'Small',
+        },
+        {
+          id: 'components-linkbutton-features--trailing-visual',
+          name: 'Trailing Visual',
+        },
+        {
+          id: 'components-linkbutton-features--with-react-router',
+          name: 'With React Router',
+        },
+      ],
+    },
+  ],
   [
     'UnderlineNav',
     {
diff --git a/src/Button/Button.features.stories.tsx b/src/Button/Button.features.stories.tsx
new file mode 100644
index 00000000000..3e684f8a9a1
--- /dev/null
+++ b/src/Button/Button.features.stories.tsx
@@ -0,0 +1,39 @@
+import {EyeIcon, HeartIcon} from '@primer/octicons-react'
+import React, {useState} from 'react'
+import {Button} from '.'
+
+export default {
+  title: 'Components/Button/Features',
+}
+
+export const Default = () => <Button>Default</Button>
+
+export const Primary = () => <Button variant="primary">Primary</Button>
+
+export const Danger = () => <Button variant="danger">Danger</Button>
+
+export const Invisible = () => <Button variant="invisible">Invisible</Button>
+
+export const Outline = () => <Button variant="outline">Outline</Button>
+
+export const LeadingVisual = () => <Button leadingIcon={HeartIcon}>Leading visual</Button>
+
+export const TrailingVisual = () => <Button trailingIcon={EyeIcon}>Trailing visual</Button>
+
+export const TrailingCounter = () => {
+  const [count, setCount] = useState(0)
+  return (
+    <Button onClick={() => setCount(count + 1)}>
+      Watch
+      <Button.Counter>{count}</Button.Counter>
+    </Button>
+  )
+}
+
+export const Disabled = () => <Button disabled>Default</Button>
+
+export const Small = () => <Button size="small">Default</Button>
+
+export const Medium = () => <Button size="medium">Default</Button>
+
+export const Large = () => <Button size="large">Default</Button>
diff --git a/src/Button/Button.stories.tsx b/src/Button/Button.stories.tsx
index 50e4d5ff5e8..cd3166523cb 100644
--- a/src/Button/Button.stories.tsx
+++ b/src/Button/Button.stories.tsx
@@ -1,8 +1,8 @@
-import {EyeClosedIcon, EyeIcon, SearchIcon, TriangleDownIcon, XIcon, TriangleRightIcon} from '@primer/octicons-react'
-import {Meta} from '@storybook/react'
-import React, {useState, forwardRef} from 'react'
-import {Button, ButtonProps, IconButton} from '.'
-import Box from '../Box'
+import React from 'react'
+import {EyeClosedIcon, EyeIcon, SearchIcon, XIcon, HeartIcon} from '@primer/octicons-react'
+import {Story, Meta} from '@storybook/react'
+import {Button} from '.'
+import {OcticonArgType} from '../utils/story-helpers'
 
 export default {
   title: 'Components/Button',
@@ -16,230 +16,24 @@ export default {
     disabled: {
       control: {
         type: 'boolean',
-        default: false,
       },
     },
+    variant: {
+      control: {
+        type: 'radio',
+        options: ['default', 'primary', 'danger', 'invisible', 'outline'],
+      },
+    },
+    leadingIcon: OcticonArgType([EyeClosedIcon, EyeIcon, SearchIcon, XIcon, HeartIcon]),
+    trailingIcon: OcticonArgType([EyeClosedIcon, EyeIcon, SearchIcon, XIcon, HeartIcon]),
   },
-} as Meta
-
-export const defaultButton = (args: ButtonProps) => {
-  return <Button {...args}>Default</Button>
-}
-
-export const primaryButton = (args: ButtonProps) => {
-  return (
-    <Button {...args} variant="primary">
-      Primary
-    </Button>
-  )
-}
-
-export const dangerButton = (args: ButtonProps) => {
-  return (
-    <Button {...args} variant="danger">
-      Danger
-    </Button>
-  )
-}
-
-export const invisibleButton = (args: ButtonProps) => {
-  return (
-    <Button {...args} variant="invisible">
-      Invisible
-    </Button>
-  )
-}
-
-export const outlineButton = (args: ButtonProps) => {
-  return (
-    <Button {...args} variant="outline">
-      Outline
-    </Button>
-  )
-}
-
-export const iconBeforeButton = (args: ButtonProps) => {
-  return (
-    <Button leadingIcon={SearchIcon} {...args}>
-      Before
-    </Button>
-  )
-}
-
-export const iconButton = ({...args}: ButtonProps) => {
-  return (
-    <>
-      <Box mb={2}>
-        <IconButton icon={XIcon} aria-label="Close" {...args} />
-      </Box>
-      <Box mb={2}>
-        <IconButton icon={XIcon} aria-label="Close" {...args} variant="invisible" sx={{mt: 2}} />
-      </Box>
-      <Box mb={2}>
-        <IconButton icon={XIcon} aria-label="Close" {...args} variant="danger" />
-      </Box>
-      <Box mb={2}>
-        <IconButton icon={XIcon} aria-label="Close" {...args} variant="primary" />
-      </Box>
-      <Box mb={2}>
-        <IconButton icon={XIcon} aria-label="Close" {...args} variant="outline" />
-      </Box>
-    </>
-  )
-}
-
-export const WatchCounterButton = ({...args}: ButtonProps) => {
-  const [count, setCount] = useState(0)
-  return (
-    <>
-      <Box mb={2}>
-        <Button onClick={() => setCount(count + 1)} {...args}>
-          Watch
-          <Button.Counter>{count}</Button.Counter>
-        </Button>
-      </Box>
-      <Box mb={2}>
-        <Button onClick={() => setCount(count + 1)} {...args} variant="primary">
-          Watch
-          <Button.Counter>{count}</Button.Counter>
-        </Button>
-      </Box>
-      <Box mb={2}>
-        <Button onClick={() => setCount(count + 1)} {...args} variant="invisible">
-          Watch
-          <Button.Counter>{count}</Button.Counter>
-        </Button>
-      </Box>
-      <Box mb={2}>
-        <Button onClick={() => setCount(count + 1)} {...args} variant="danger">
-          Watch
-          <Button.Counter>{count}</Button.Counter>
-        </Button>
-      </Box>
-      <Box mb={2}>
-        <Button onClick={() => setCount(count + 1)} {...args} variant="outline">
-          Watch
-          <Button.Counter>{count}</Button.Counter>
-        </Button>
-      </Box>
-    </>
-  )
-}
-
-export const WatchIconButton = ({...args}: ButtonProps) => {
-  const [watching, setWatching] = useState(false)
-  const icon = watching ? EyeClosedIcon : () => <EyeIcon />
-  return (
-    <Button onClick={() => setWatching(!watching)} trailingIcon={icon} {...args}>
-      Watch
-    </Button>
-  )
-}
-
-export const caretButton = ({...args}: ButtonProps) => {
-  return (
-    <Button trailingIcon={TriangleDownIcon} {...args}>
-      Dropdown
-    </Button>
-  )
-}
-
-export const blockButton = ({...args}: ButtonProps) => {
-  return (
-    <Button {...args} sx={{width: '100%'}}>
-      Block
-    </Button>
-  )
-}
-
-export const DisabledButton = ({...args}: ButtonProps) => {
-  const [count, setCount] = useState(0)
-  return (
-    <>
-      <Box mb={2}>
-        <Button disabled onClick={() => setCount(count + 1)} {...args}>
-          Watch
-          <Button.Counter>{count}</Button.Counter>
-        </Button>
-      </Box>
-      <Box mb={2}>
-        <Button disabled {...args}>
-          Disabled
-        </Button>
-      </Box>
-      <Box mb={2}>
-        <Button disabled variant="danger" {...args}>
-          Disabled
-        </Button>
-      </Box>
-      <Box mb={2}>
-        <Button disabled variant="invisible" {...args}>
-          Disabled
-        </Button>
-      </Box>
-      <Box mb={2}>
-        <Button disabled variant="primary" {...args}>
-          Disabled
-        </Button>
-      </Box>
-      <Box mb={2}>
-        <Button disabled variant="outline" {...args}>
-          Disabled
-        </Button>
-      </Box>
-      <Box mb={2}>
-        <IconButton disabled icon={() => <XIcon />} aria-label="Close" {...args} />
-      </Box>
-    </>
-  )
-}
-
-type ReactRouterLikeLinkProps = {to: string; children: React.ReactNode}
-const ReactRouterLikeLink = forwardRef<HTMLAnchorElement, ReactRouterLikeLinkProps>(
-  ({to, ...props}: {to: string; children: React.ReactNode}, ref) => {
-    // eslint-disable-next-line jsx-a11y/anchor-has-content
-    return <a ref={ref} href={to} {...props} />
+  args: {
+    size: 'medium',
+    disabled: false,
+    variant: 'default',
+    trailingIcon: null,
+    leadingIcon: null,
   },
-)
+} as Meta<typeof Button>
 
-export const linkButton = ({...args}: ButtonProps) => {
-  return (
-    <>
-      <Box mb={2} display="flex">
-        <Button as="a" href="https://primer.style/" {...args}>
-          Link to Primer
-        </Button>
-      </Box>
-      <Box mb={2} display="flex">
-        <Button as="a" href="https://primer.style/" variant="danger" {...args}>
-          Link to Primer
-        </Button>
-      </Box>
-      <Box mb={2} display="flex">
-        <Button as="a" href="https://primer.style/" variant="primary" {...args}>
-          Link to Primer
-        </Button>
-      </Box>
-      <Box mb={2} display="flex">
-        <Button as="a" href="https://primer.style/" variant="outline" {...args}>
-          Link to Primer
-        </Button>
-      </Box>
-      <Box mb={2} display="flex">
-        <Button as="a" href="https://primer.style/" variant="invisible" {...args}>
-          Link to Primer
-        </Button>
-      </Box>
-      <Box mb={2} display="flex">
-        <Button as="a" href="https://primer.style/" variant="primary" trailingIcon={TriangleRightIcon} {...args}>
-          Link to Primer
-        </Button>
-      </Box>
-      <Box mb={2} display="flex">
-        <Button to="/dummy" as={ReactRouterLikeLink} variant="primary" trailingIcon={TriangleRightIcon} {...args}>
-          Link to Primer
-        </Button>
-      </Box>
-    </>
-  )
-}
+export const Playground: Story<typeof Button> = args => <Button {...args}>Default</Button>
diff --git a/src/Button/IconButton.features.stories.tsx b/src/Button/IconButton.features.stories.tsx
new file mode 100644
index 00000000000..ae550b89a2e
--- /dev/null
+++ b/src/Button/IconButton.features.stories.tsx
@@ -0,0 +1,23 @@
+import {HeartIcon} from '@primer/octicons-react'
+import React from 'react'
+import {IconButton} from '.'
+
+export default {
+  title: 'Components/IconButton/Features',
+}
+
+export const Default = () => <IconButton icon={HeartIcon} aria-label="Default" />
+
+export const Primary = () => <IconButton icon={HeartIcon} variant="primary" aria-label="Primary" />
+
+export const Danger = () => <IconButton icon={HeartIcon} variant="danger" aria-label="Danger" />
+
+export const Invisible = () => <IconButton icon={HeartIcon} variant="invisible" aria-label="Invisible" />
+
+export const Disabled = () => <IconButton disabled icon={HeartIcon} aria-label="Disabled" />
+
+export const Small = () => <IconButton size="small" icon={HeartIcon} aria-label="Default" />
+
+export const Medium = () => <IconButton size="medium" icon={HeartIcon} aria-label="Default" />
+
+export const Large = () => <IconButton size="large" icon={HeartIcon} aria-label="Default" />
diff --git a/src/Button/IconButton.stories.tsx b/src/Button/IconButton.stories.tsx
new file mode 100644
index 00000000000..4418fac7ffc
--- /dev/null
+++ b/src/Button/IconButton.stories.tsx
@@ -0,0 +1,38 @@
+import React from 'react'
+import {EyeClosedIcon, EyeIcon, SearchIcon, XIcon, HeartIcon} from '@primer/octicons-react'
+import {Story, Meta} from '@storybook/react'
+import {IconButton} from '.'
+import {OcticonArgType} from '../utils/story-helpers'
+
+export default {
+  title: 'Components/IconButton',
+  argTypes: {
+    size: {
+      control: {
+        type: 'radio',
+        options: ['small', 'medium', 'large'],
+      },
+    },
+    disabled: {
+      control: {
+        type: 'boolean',
+      },
+    },
+    variant: {
+      control: {
+        type: 'radio',
+        options: ['default', 'primary', 'danger', 'invisible'],
+      },
+    },
+    icon: OcticonArgType([EyeClosedIcon, EyeIcon, SearchIcon, XIcon, HeartIcon]),
+  },
+  args: {
+    size: 'medium',
+    disabled: false,
+    variant: 'default',
+    'aria-label': 'Icon button description',
+    icon: XIcon,
+  },
+} as Meta<typeof IconButton>
+
+export const Playground: Story<typeof IconButton> = args => <IconButton {...args} />
diff --git a/src/Button/LinkButton.features.stories.tsx b/src/Button/LinkButton.features.stories.tsx
new file mode 100644
index 00000000000..1a53318634b
--- /dev/null
+++ b/src/Button/LinkButton.features.stories.tsx
@@ -0,0 +1,81 @@
+import {EyeIcon, HeartIcon} from '@primer/octicons-react'
+import React, {forwardRef} from 'react'
+import {Button} from '.'
+
+export default {
+  title: 'Components/LinkButton/Features',
+}
+
+export const Default = () => (
+  <Button as="a" href="/">
+    Default
+  </Button>
+)
+
+export const Primary = () => (
+  <Button as="a" href="/" variant="primary">
+    Primary
+  </Button>
+)
+
+export const Danger = () => (
+  <Button as="a" href="/" variant="danger">
+    Danger
+  </Button>
+)
+
+export const Invisible = () => (
+  <Button as="a" href="/" variant="invisible">
+    Invisible
+  </Button>
+)
+
+export const Outline = () => (
+  <Button as="a" href="/" variant="outline">
+    Invisible
+  </Button>
+)
+
+export const LeadingVisual = () => (
+  <Button as="a" href="/" leadingIcon={HeartIcon}>
+    Leading visual
+  </Button>
+)
+
+export const TrailingVisual = () => (
+  <Button as="a" href="/" trailingIcon={EyeIcon}>
+    Trailing visual
+  </Button>
+)
+
+export const Small = () => (
+  <Button as="a" href="/" size="small">
+    Default
+  </Button>
+)
+
+export const Medium = () => (
+  <Button as="a" href="/" size="medium">
+    Default
+  </Button>
+)
+
+export const Large = () => (
+  <Button as="a" href="/" size="large">
+    Default
+  </Button>
+)
+
+type ReactRouterLikeLinkProps = {to: string; children: React.ReactNode}
+const ReactRouterLikeLink = forwardRef<HTMLAnchorElement, ReactRouterLikeLinkProps>(
+  ({to, ...props}: {to: string; children: React.ReactNode}, ref) => {
+    // eslint-disable-next-line jsx-a11y/anchor-has-content
+    return <a ref={ref} href={to} {...props} />
+  },
+)
+
+export const WithReactRouter = () => (
+  <Button to="/dummy" as={ReactRouterLikeLink}>
+    Default
+  </Button>
+)
diff --git a/src/Button/LinkButton.stories.tsx b/src/Button/LinkButton.stories.tsx
new file mode 100644
index 00000000000..feca1c35a6f
--- /dev/null
+++ b/src/Button/LinkButton.stories.tsx
@@ -0,0 +1,39 @@
+import React from 'react'
+import {EyeClosedIcon, EyeIcon, SearchIcon, XIcon, HeartIcon} from '@primer/octicons-react'
+import {Story, Meta} from '@storybook/react'
+import {Button} from '.'
+import {OcticonArgType} from '../utils/story-helpers'
+
+export default {
+  title: 'Components/LinkButton',
+  argTypes: {
+    size: {
+      control: {
+        type: 'radio',
+        options: ['small', 'medium', 'large'],
+      },
+    },
+    variant: {
+      control: {
+        type: 'radio',
+        options: ['default', 'primary', 'danger', 'invisible', 'outline'],
+      },
+    },
+    leadingIcon: OcticonArgType([EyeClosedIcon, EyeIcon, SearchIcon, XIcon, HeartIcon]),
+    trailingIcon: OcticonArgType([EyeClosedIcon, EyeIcon, SearchIcon, XIcon, HeartIcon]),
+    href: {control: 'text'},
+  },
+  args: {
+    size: 'medium',
+    variant: 'default',
+    trailingIcon: null,
+    leadingIcon: null,
+    href: '/',
+  },
+} as Meta<typeof Button>
+
+export const Playground: Story<typeof Button> = args => (
+  <Button as="a" {...args}>
+    Default
+  </Button>
+)