diff --git a/scss/account.scss b/scss/account.scss
index 0af8e8de..0445b743 100644
--- a/scss/account.scss
+++ b/scss/account.scss
@@ -7,6 +7,10 @@
 	margin-left: auto;
 	margin-right: auto;
 
+	[component="account/sidebar"] {
+		view-transition-name: account-sidebar;
+	}
+
 	.avatar-wrapper {
 		border: 4px solid white;
 		border-radius: 50%;
diff --git a/templates/partials/account/sidebar-left.tpl b/templates/partials/account/sidebar-left.tpl
index 67b813f2..5179fda1 100644
--- a/templates/partials/account/sidebar-left.tpl
+++ b/templates/partials/account/sidebar-left.tpl
@@ -1,4 +1,4 @@
-<div class="flex-0 pe-2 border-end-md text-sm mb-3 flex-basis-md-200">
+<div class="flex-0 pe-2 border-end-md text-sm mb-3 flex-basis-md-200" component="account/sidebar">
 	<div class="sticky-md-top d-flex flex-row flex-md-column flex-wrap gap-1" style="top: 1rem;z-index: 1;">
 		<a href="{config.relative_path}/user/{userslug}" class="btn-ghost fw-semibold {{{ if template.account/profile }}}active{{{ end }}}">
 			<div class="flex-1">[[global:about]]</div>