diff --git a/front/packages/ui/src/downloads/index.web.tsx b/front/packages/ui/src/downloads/index.web.tsx
index 12829832..3268da59 100644
--- a/front/packages/ui/src/downloads/index.web.tsx
+++ b/front/packages/ui/src/downloads/index.web.tsx
@@ -37,11 +37,12 @@ export const useDownloader = () => {
 			query.parser,
 			account?.token.access_token,
 		);
+		const quality = account?.settings.downloadQuality ?? "original";
 
 		// TODO: This methods does not work with auth.
 		const a = document.createElement("a");
 		a.style.display = "none";
-		a.href = `${kyooApiUrl}/video/${type}/${slug}/direct`;
+		a.href = `${kyooApiUrl}/video/${type}/${slug}/offline?quality=${quality}`;
 		a.download = `${slug}.${info.extension}`;
 		document.body.appendChild(a);
 		a.click();
diff --git a/front/packages/ui/src/downloads/state.tsx b/front/packages/ui/src/downloads/state.tsx
index 092e53f5..54f6c38d 100644
--- a/front/packages/ui/src/downloads/state.tsx
+++ b/front/packages/ui/src/downloads/state.tsx
@@ -186,8 +186,7 @@ const download = (
 	const path = `${RNBackgroundDownloader.directories.documents}/${slug}-${id}.${extension}`;
 	const task = RNBackgroundDownloader.download({
 		id: id,
-		// TODO: support variant qualities
-		url: `${account.apiUrl}/video/${type}/${slug}/direct`,
+		url: `${account.apiUrl}/video/${type}/${slug}/offline?quality=${account.settings.downloadQuality}`,
 		destination: path,
 		headers: {
 			Authorization: account.token.access_token,