diff --git a/docs/resources/changelog.md b/docs/resources/changelog.md
index 8f2b0a983..997fe312b 100644
--- a/docs/resources/changelog.md
+++ b/docs/resources/changelog.md
@@ -6,6 +6,12 @@ Components with the Experimental bad
_During the beta period, these restrictions may be relaxed in the event of a mission-critical bug._ 🐛
+## 2.0.0-beta.64
+
+- Added `role="status"` to ``
+- Fixed broken spinner animation in Safari [#633](https://github.com/shoelace-style/shoelace/issues/633)
+- Improved `` track color when used on various backgrounds
+
## 2.0.0-beta.63
- 🚨 BREAKING: changed the `type` attribute to `variant` in ``, ``, ``, and `` since it's more appropriate and to disambiguate from other `type` attributes
diff --git a/src/components/spinner/spinner.styles.ts b/src/components/spinner/spinner.styles.ts
index b33611282..7b56082ae 100644
--- a/src/components/spinner/spinner.styles.ts
+++ b/src/components/spinner/spinner.styles.ts
@@ -34,16 +34,13 @@ export default css`
.spinner__track {
stroke: var(--track-color);
transform-origin: 0% 0%;
+ mix-blend-mode: multiply;
}
.spinner__indicator {
stroke: var(--indicator-color);
stroke-linecap: round;
- /* stroke-dasharray: (2πr x p), (2πr) where p is the percentage to display */
- stroke-dasharray: calc(2 * 3.141592 * calc(0.5em - var(--track-width) / 2) * 0.75),
- calc(2 * 3.141592 * calc(0.5em - var(--track-width) / 2));
- transform-origin: 50% 50%;
- transform: rotate(90deg);
+ stroke-dasharray: 150% 75%;
animation: spin var(--speed) linear infinite;
}
diff --git a/src/components/spinner/spinner.ts b/src/components/spinner/spinner.ts
index cf3fdf1a8..0d40a1c19 100644
--- a/src/components/spinner/spinner.ts
+++ b/src/components/spinner/spinner.ts
@@ -19,7 +19,7 @@ export default class SlSpinner extends LitElement {
render() {
return html`
-