diff --git a/packages/website/src/components/DocContainer.tsx b/packages/website/src/components/DocContainer.tsx
index 22dea006d..61aee7e47 100644
--- a/packages/website/src/components/DocContainer.tsx
+++ b/packages/website/src/components/DocContainer.tsx
@@ -1,7 +1,7 @@
 import { Group, Stack, Title, Text, Box, MediaQuery, Aside, ScrollArea, Skeleton } from '@mantine/core';
 import { useMediaQuery } from '@mantine/hooks';
 import { useRouter } from 'next/router';
-import { Fragment, ReactNode } from 'react';
+import { Fragment, type ReactNode } from 'react';
 import {
 	VscSymbolClass,
 	VscSymbolMethod,
@@ -68,7 +68,7 @@ export function DocContainer({
 	return (
 		<Group>
 			<Stack sx={{ flexGrow: 1, maxWidth: '100%' }}>
-				<Skeleton visible={router.isFallback} radius="xs">
+				<Skeleton visible={router.isFallback} radius="sm">
 					<Title sx={{ wordBreak: 'break-all' }} order={2} ml="xs">
 						<Group>
 							{generateIcon(kind)}
@@ -77,13 +77,13 @@ export function DocContainer({
 					</Title>
 				</Skeleton>
 
-				<Skeleton visible={router.isFallback} radius="xs">
+				<Skeleton visible={router.isFallback} radius="sm">
 					<Section title="Summary" icon={<VscListSelection size={20} />} padded dense={matches}>
 						{summary ? <TSDoc node={summary} /> : <Text>No summary provided.</Text>}
 					</Section>
 				</Skeleton>
 
-				<Skeleton visible={router.isFallback} radius="xs">
+				<Skeleton visible={router.isFallback} radius="sm">
 					<Box px="xs" pb="xs">
 						<SyntaxHighlighter
 							wrapLongLines
@@ -123,7 +123,7 @@ export function DocContainer({
 					</Group>
 				) : null}
 
-				<Skeleton visible={router.isFallback} radius="xs">
+				<Skeleton visible={router.isFallback} radius="sm">
 					<Stack>
 						{typeParams?.length ? (
 							<Section
diff --git a/packages/website/src/components/Section.tsx b/packages/website/src/components/Section.tsx
index 83202e8b4..948546d57 100644
--- a/packages/website/src/components/Section.tsx
+++ b/packages/website/src/components/Section.tsx
@@ -62,7 +62,7 @@ export function Section({
 				<Group position="apart">
 					<Group>
 						{icon ? (
-							<ThemeIcon variant={colorScheme === 'dark' ? 'filled' : 'outline'} size={30}>
+							<ThemeIcon variant={colorScheme === 'dark' ? 'filled' : 'outline'} radius="sm" size={30}>
 								{icon}
 							</ThemeIcon>
 						) : null}
diff --git a/packages/website/src/components/SidebarItems.tsx b/packages/website/src/components/SidebarItems.tsx
index dec4fa451..665dfc5a4 100644
--- a/packages/website/src/components/SidebarItems.tsx
+++ b/packages/website/src/components/SidebarItems.tsx
@@ -1,4 +1,4 @@
-import { createStyles, Group, Text, NavLink } from '@mantine/core';
+import { createStyles, Group, Text, NavLink, Box } from '@mantine/core';
 import Link from 'next/link';
 import { useRouter } from 'next/router';
 import type { Dispatch, SetStateAction } from 'react';
@@ -105,7 +105,7 @@ export function SidebarItems({
 	const asPathWithoutQueryAndAnchor = router.asPath.split('?')[0]?.split('#')[0];
 
 	return (
-		<>
+		<Box pb="xl">
 			{(Object.keys(groupItems) as (keyof GroupedMembers)[])
 				.filter((group) => groupItems[group].length)
 				.map((group, idx) => (
@@ -135,6 +135,6 @@ export function SidebarItems({
 						))}
 					</Section>
 				))}
-		</>
+		</Box>
 	);
 }
diff --git a/packages/website/src/components/SidebarLayout.tsx b/packages/website/src/components/SidebarLayout.tsx
index 86e225378..b726b4289 100644
--- a/packages/website/src/components/SidebarLayout.tsx
+++ b/packages/website/src/components/SidebarLayout.tsx
@@ -164,14 +164,14 @@ export function SidebarLayout({
 										<Menu
 											onOpen={() => setOpenedLibPicker(true)}
 											onClose={() => setOpenedLibPicker(false)}
-											radius="xs"
+											radius="sm"
 											width="target"
 										>
 											<Menu.Target>
 												<UnstyledButton className={classes.control}>
 													<Group position="apart">
 														<Group>
-															<ThemeIcon variant={colorScheme === 'dark' ? 'filled' : 'outline'} size={30}>
+															<ThemeIcon variant={colorScheme === 'dark' ? 'filled' : 'outline'} radius="sm" size={30}>
 																<VscPackage size={20} />
 															</ThemeIcon>
 															<Text weight="600" size="md">
@@ -188,14 +188,14 @@ export function SidebarLayout({
 										<Menu
 											onOpen={() => setOpenedVersionPicker(true)}
 											onClose={() => setOpenedVersionPicker(false)}
-											radius="xs"
+											radius="sm"
 											width="target"
 										>
 											<Menu.Target>
 												<UnstyledButton className={classes.control}>
 													<Group position="apart">
 														<Group>
-															<ThemeIcon variant={colorScheme === 'dark' ? 'filled' : 'outline'} size={30}>
+															<ThemeIcon variant={colorScheme === 'dark' ? 'filled' : 'outline'} radius="sm" size={30}>
 																<VscVersions size={20} />
 															</ThemeIcon>
 															<Text weight="600" size="md">
@@ -243,7 +243,7 @@ export function SidebarLayout({
 							</MediaQuery>
 
 							<MediaQuery smallerThan="md" styles={{ display: 'none' }}>
-								<Skeleton visible={router.isFallback} radius="xs">
+								<Skeleton visible={router.isFallback} radius="sm">
 									<Breadcrumbs>{breadcrumbs}</Breadcrumbs>
 								</Skeleton>
 							</MediaQuery>
@@ -266,7 +266,7 @@ export function SidebarLayout({
 								color={colorScheme === 'dark' ? 'yellow' : 'blue'}
 								onClick={() => toggleColorScheme()}
 								title="Toggle color scheme"
-								radius="xs"
+								radius="sm"
 							>
 								{colorScheme === 'dark' ? <WiDaySunny size={30} /> : <WiNightClear size={30} />}
 							</ActionIcon>
diff --git a/packages/website/src/components/TableOfContentItems.tsx b/packages/website/src/components/TableOfContentItems.tsx
index 4999d8a1f..179c703ae 100644
--- a/packages/website/src/components/TableOfContentItems.tsx
+++ b/packages/website/src/components/TableOfContentItems.tsx
@@ -66,16 +66,16 @@ export function TableOfContentItems({
 	});
 
 	return (
-		<Box sx={{ wordBreak: 'break-all' }}>
-			<Group mt={2} mb="sm" ml={2}>
+		<Box sx={{ wordBreak: 'break-all' }} pb="xl">
+			<Group spacing="xs" mt={6} mb="sm" ml={6}>
 				<VscListSelection size={25} />
 				<Text weight={600}>Table of contents</Text>
 			</Group>
-			<Stack spacing={0}>
+			<Stack spacing={0} mt={26} ml={4}>
 				{propertyItems.length ? (
 					<Box>
-						<Group>
-							<ThemeIcon variant={colorScheme === 'dark' ? 'filled' : 'outline'} size={30}>
+						<Group spacing="xs">
+							<ThemeIcon variant={colorScheme === 'dark' ? 'filled' : 'outline'} radius="sm" size={30}>
 								<VscSymbolProperty size={20} />
 							</ThemeIcon>
 							<Box p="sm" pl={0}>
@@ -90,7 +90,7 @@ export function TableOfContentItems({
 				{methodItems.length ? (
 					<Box>
 						<Group spacing="xs">
-							<ThemeIcon variant={colorScheme === 'dark' ? 'filled' : 'outline'} size={30}>
+							<ThemeIcon variant={colorScheme === 'dark' ? 'filled' : 'outline'} radius="sm" size={30}>
 								<VscSymbolMethod size={20} />
 							</ThemeIcon>
 							<Box p="sm" pl={0}>
diff --git a/packages/website/src/components/model/Class.tsx b/packages/website/src/components/model/Class.tsx
index 083bb6134..d40bb5b29 100644
--- a/packages/website/src/components/model/Class.tsx
+++ b/packages/website/src/components/model/Class.tsx
@@ -21,10 +21,10 @@ export function Class({ data }: { data: ApiClassJSON }) {
 			properties={data.properties}
 		>
 			{data.constructor ? <ConstructorSection data={data.constructor} /> : null}
-			<Skeleton visible={router.isFallback} radius="xs">
+			<Skeleton visible={router.isFallback} radius="sm">
 				<PropertiesSection data={data.properties} />
 			</Skeleton>
-			<Skeleton visible={router.isFallback} radius="xs">
+			<Skeleton visible={router.isFallback} radius="sm">
 				<MethodsSection data={data.methods} />
 			</Skeleton>
 		</DocContainer>
diff --git a/packages/website/src/components/model/Enum.tsx b/packages/website/src/components/model/Enum.tsx
index 69b52371e..d4b984de5 100644
--- a/packages/website/src/components/model/Enum.tsx
+++ b/packages/website/src/components/model/Enum.tsx
@@ -13,7 +13,7 @@ export function Enum({ data }: { data: ApiEnumJSON }) {
 
 	return (
 		<DocContainer name={data.name} kind={data.kind} excerpt={data.excerpt} summary={data.summary}>
-			<Skeleton visible={router.isFallback} radius="xs">
+			<Skeleton visible={router.isFallback} radius="sm">
 				<Section title="Members" icon={<VscSymbolEnumMember size={20} />} padded dense={matches}>
 					<Stack>
 						{data.members.map((member) => (
diff --git a/packages/website/src/components/model/Function.tsx b/packages/website/src/components/model/Function.tsx
index 559075db2..1d3f997eb 100644
--- a/packages/website/src/components/model/Function.tsx
+++ b/packages/website/src/components/model/Function.tsx
@@ -15,7 +15,7 @@ export function Function({ data }: { data: ApiFunctionJSON }) {
 			summary={data.summary}
 			typeParams={data.typeParameters}
 		>
-			<Skeleton visible={router.isFallback} radius="xs">
+			<Skeleton visible={router.isFallback} radius="sm">
 				<ParametersSection data={data.parameters} />
 			</Skeleton>
 		</DocContainer>
diff --git a/packages/website/src/components/model/Interface.tsx b/packages/website/src/components/model/Interface.tsx
index 007f048bb..a1e969a3b 100644
--- a/packages/website/src/components/model/Interface.tsx
+++ b/packages/website/src/components/model/Interface.tsx
@@ -17,10 +17,10 @@ export function Interface({ data }: { data: ApiInterfaceJSON }) {
 			methods={data.methods}
 			properties={data.properties}
 		>
-			<Skeleton visible={router.isFallback} radius="xs">
+			<Skeleton visible={router.isFallback} radius="sm">
 				<PropertiesSection data={data.properties} />
 			</Skeleton>
-			<Skeleton visible={router.isFallback} radius="xs">
+			<Skeleton visible={router.isFallback} radius="sm">
 				<MethodsSection data={data.methods} />
 			</Skeleton>
 		</DocContainer>
diff --git a/packages/website/src/components/tsdoc/BlockComment.tsx b/packages/website/src/components/tsdoc/BlockComment.tsx
index 8f155b26a..e5037a3f4 100644
--- a/packages/website/src/components/tsdoc/BlockComment.tsx
+++ b/packages/website/src/components/tsdoc/BlockComment.tsx
@@ -24,7 +24,7 @@ export function ExampleBlock({
 
 export function DeprecatedBlock({ children }: { children: ReactNode }): JSX.Element {
 	return (
-		<Alert icon={<VscWarning />} title="Deprecated" variant="outline" color="red" radius="xs">
+		<Alert icon={<VscWarning />} title="Deprecated" variant="outline" color="red" radius="sm">
 			{children}
 		</Alert>
 	);
diff --git a/packages/website/src/pages/docs/packages/[package]/index.tsx b/packages/website/src/pages/docs/packages/[package]/index.tsx
index f7923065c..9f7e77d1a 100644
--- a/packages/website/src/pages/docs/packages/[package]/index.tsx
+++ b/packages/website/src/pages/docs/packages/[package]/index.tsx
@@ -96,7 +96,7 @@ export default function VersionsRoute(props: Partial<VersionProps> & { error?: s
 						<UnstyledButton className={classes.control} component="a">
 							<Group position="apart">
 								<Group>
-									<ThemeIcon variant={colorScheme === 'dark' ? 'filled' : 'outline'} size={30}>
+									<ThemeIcon variant={colorScheme === 'dark' ? 'filled' : 'outline'} radius="sm" size={30}>
 										<VscVersions size={20} />
 									</ThemeIcon>
 									<Text weight={600} size="md">
diff --git a/packages/website/src/pages/docs/packages/index.tsx b/packages/website/src/pages/docs/packages/index.tsx
index 4e4cbe0ad..c5eb3254b 100644
--- a/packages/website/src/pages/docs/packages/index.tsx
+++ b/packages/website/src/pages/docs/packages/index.tsx
@@ -41,7 +41,7 @@ export default function PackagesRoute() {
 						<UnstyledButton className={classes.control} component="a">
 							<Group position="apart">
 								<Group>
-									<ThemeIcon variant={colorScheme === 'dark' ? 'filled' : 'outline'} size={30}>
+									<ThemeIcon variant={colorScheme === 'dark' ? 'filled' : 'outline'} radius="sm" size={30}>
 										<VscPackage size={20} />
 									</ThemeIcon>
 									<Text weight={600} size="md">
diff --git a/packages/website/src/pages/index.tsx b/packages/website/src/pages/index.tsx
index 05d96cbcb..8ab76c9f5 100644
--- a/packages/website/src/pages/index.tsx
+++ b/packages/website/src/pages/index.tsx
@@ -84,12 +84,12 @@ export default function IndexRoute() {
 
 					<Group mt={30}>
 						<Link href="/docs" passHref>
-							<Button component="a" radius="xl" size="md" className={classes.control}>
+							<Button component="a" radius="sm" size="md" className={classes.control}>
 								Docs
 							</Button>
 						</Link>
 						<Link href="https://discordjs.guide" passHref>
-							<Button component="a" variant="default" radius="xl" size="md" className={classes.control}>
+							<Button component="a" variant="default" radius="sm" size="md" className={classes.control}>
 								Guide
 							</Button>
 						</Link>