2026-02-01 12:21:14 +05:30
<!doctype html>
< html lang = "en" >
< head >
< meta charset = "UTF-8" / >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" / >
< title >
Adjust Colors Online Free - PDF Color Adjustment Tool | BentoPDF
< / title >
< meta
name="title"
content="Adjust Colors Online Free - PDF Color Adjustment Tool | BentoPDF"
/>
< meta
name="description"
content="★ Adjust PDF colors online free - Brightness, contrast, saturation, hue, temperature & more ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure"
/>
< meta
name="keywords"
content="adjust pdf colors, pdf brightness, pdf contrast, pdf saturation, pdf hue shift, pdf color correction"
/>
< meta name = "author" content = "BentoPDF" / >
< meta
name="robots"
content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1"
/>
< link rel = "canonical" href = "https://www.bentopdf.com/adjust-colors.html" / >
< meta property = "og:type" content = "website" / >
< meta property = "og:url" content = "https://www.bentopdf.com/adjust-colors" / >
< meta
property="og:title"
content="Adjust Colors Online Free - PDF Color Adjustment Tool | BentoPDF"
/>
< meta
property="og:description"
content="★ Adjust PDF colors online free - Brightness, contrast, saturation, hue, temperature & more ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure"
/>
< meta
property="og:image"
content="https://www.bentopdf.com/images/og-adjust-colors.png"
/>
< meta property = "og:image:width" content = "1200" / >
< meta property = "og:image:height" content = "630" / >
< meta property = "og:site_name" content = "BentoPDF" / >
< meta name = "twitter:card" content = "summary_large_image" / >
< meta name = "twitter:url" content = "https://www.bentopdf.com/adjust-colors" / >
< meta name = "twitter:title" content = "Adjust Colors Free" / >
< meta
name="twitter:description"
content="★ Adjust PDF colors online free - Brightness, contrast, saturation, hue & more ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser"
/>
< meta
name="twitter:image"
content="https://www.bentopdf.com/images/twitter-adjust-colors.png"
/>
< meta name = "twitter:site" content = "@BentoPDF" / >
< meta name = "mobile-web-app-capable" content = "yes" / >
< meta name = "apple-mobile-web-app-capable" content = "yes" / >
< meta name = "apple-mobile-web-app-title" content = "Adjust Colors" / >
< title > Adjust Colors - BentoPDF< / title >
< meta
name="description"
content="Adjust brightness, contrast, saturation, hue, temperature, gamma and more in your PDF. Free, secure, and runs entirely in your browser."
/>
< link href = "/src/css/styles.css" rel = "stylesheet" / >
< link rel = "manifest" href = "/site.webmanifest" / >
< link rel = "icon" type = "image/svg+xml" href = "/images/favicon.svg" / >
< link
rel="icon"
type="image/png"
sizes="192x192"
href="/images/favicon-192x192.png"
/>
< link
rel="icon"
type="image/png"
sizes="512x512"
href="/images/favicon-512x512.png"
/>
< link
rel="apple-touch-icon"
sizes="180x180"
href="/images/apple-touch-icon.png"
/>
< link rel = "icon" href = "/favicon.ico" sizes = "32x32" / >
< / head >
< body class = "antialiased bg-gray-900" >
{{> navbar }}
< div
id="uploader"
class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900"
>
< div
id="tool-uploader"
class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-4xl w-full text-gray-200 border border-gray-700"
>
< button
id="back-to-tools"
class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold"
>
< i data-lucide = "arrow-left" class = "cursor-pointer" > < / i >
< span class = "cursor-pointer" data-i18n = "tools.backToTools" >
Back to Tools
< / span >
< / button >
< h1
class="text-2xl font-bold text-white mb-2"
data-i18n="tools:adjustColors.name"
>
2026-03-04 13:46:16 +05:30
Adjust Colors
2026-02-01 12:21:14 +05:30
< / h1 >
< p class = "text-gray-400 mb-6" data-i18n = "tools:adjustColors.subtitle" >
2026-03-04 13:46:16 +05:30
Fine-tune brightness, contrast, saturation and more in your PDF.
2026-02-01 12:21:14 +05:30
< / p >
< div
id="drop-zone"
class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300"
>
< div class = "flex flex-col items-center justify-center pt-5 pb-6" >
< i
data-lucide="upload-cloud"
class="w-10 h-10 mb-3 text-gray-400"
>< / i >
< p class = "mb-2 text-sm text-gray-400" >
< span class = "font-semibold" data-i18n = "upload.clickToSelect"
>Click to select a file< /span
>
< span data-i18n = "upload.orDragAndDrop" > or drag and drop< / span >
< / p >
2026-02-02 16:30:59 +05:30
< p class = "text-xs text-gray-500" data-i18n = "upload.hints.singlePdf" >
A single PDF file
< / p >
2026-02-01 12:21:14 +05:30
< p class = "text-xs text-gray-500" data-i18n = "upload.filesNeverLeave" >
Your files never leave your device.
< / p >
< / div >
< input
id="file-input"
type="file"
class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
accept="application/pdf"
/>
< / div >
< div id = "file-display-area" class = "mt-4 space-y-2" > < / div >
< div id = "options-panel" class = "hidden mt-6" >
< div class = "flex flex-col lg:flex-row gap-6" >
< div class = "flex-1 min-w-0" >
< div
class="border border-gray-600 rounded-lg overflow-hidden bg-gray-900"
>
< canvas id = "preview-canvas" class = "w-full" > < / canvas >
< / div >
< / div >
< div class = "lg:w-80 flex-shrink-0 space-y-4" >
< div class = "flex items-center justify-between" >
< h3
class="text-lg font-semibold text-white flex items-center gap-2"
>
< i data-lucide = "palette" class = "w-5 h-5" > < / i >
< span data-i18n = "tools:adjustColors.colorSettings"
>Color Settings< /span
>
< / h3 >
< button
id="reset-settings-btn"
class="text-xs text-gray-300 hover:text-white border border-gray-600 hover:border-gray-500 px-3 py-1 rounded-lg transition-colors"
>
Reset
< / button >
< / div >
< div >
< div class = "flex justify-between text-sm mb-1" >
< span
class="text-gray-300"
data-i18n="tools:adjustColors.brightness"
>Brightness< /span
>
< span id = "brightness-value" class = "text-gray-400" > 0< / span >
< / div >
< input
type="range"
id="setting-brightness"
min="-100"
max="100"
value="0"
class="w-full accent-indigo-500"
/>
< / div >
< div >
< div class = "flex justify-between text-sm mb-1" >
< span
class="text-gray-300"
data-i18n="tools:adjustColors.contrast"
>Contrast< /span
>
< span id = "contrast-value" class = "text-gray-400" > 0< / span >
< / div >
< input
type="range"
id="setting-contrast"
min="-100"
max="100"
value="0"
class="w-full accent-indigo-500"
/>
< / div >
< div >
< div class = "flex justify-between text-sm mb-1" >
< span
class="text-gray-300"
data-i18n="tools:adjustColors.saturation"
>Saturation< /span
>
< span id = "saturation-value" class = "text-gray-400" > 0< / span >
< / div >
< input
type="range"
id="setting-saturation"
min="-100"
max="100"
value="0"
class="w-full accent-indigo-500"
/>
< / div >
< div >
< div class = "flex justify-between text-sm mb-1" >
< span
class="text-gray-300"
data-i18n="tools:adjustColors.hueShift"
>Hue Shift< /span
>
< span id = "hue-shift-value" class = "text-gray-400" > 0°< / span >
< / div >
< input
type="range"
id="setting-hue-shift"
min="0"
max="360"
value="0"
class="w-full accent-indigo-500"
/>
< / div >
< div >
< div class = "flex justify-between text-sm mb-1" >
< span
class="text-gray-300"
data-i18n="tools:adjustColors.temperature"
>Temperature< /span
>
< span id = "temperature-value" class = "text-gray-400" > 0< / span >
< / div >
< input
type="range"
id="setting-temperature"
min="-50"
max="50"
value="0"
class="w-full accent-indigo-500"
/>
< / div >
< div >
< div class = "flex justify-between text-sm mb-1" >
< span
class="text-gray-300"
data-i18n="tools:adjustColors.tint"
>Tint< /span
>
< span id = "tint-value" class = "text-gray-400" > 0< / span >
< / div >
< input
type="range"
id="setting-tint"
min="-50"
max="50"
value="0"
class="w-full accent-indigo-500"
/>
< / div >
< div >
< div class = "flex justify-between text-sm mb-1" >
< span
class="text-gray-300"
data-i18n="tools:adjustColors.gamma"
>Gamma< /span
>
< span id = "gamma-value" class = "text-gray-400" > 1.0< / span >
< / div >
< input
type="range"
id="setting-gamma"
min="0.2"
max="5.0"
value="1.0"
step="0.1"
class="w-full accent-indigo-500"
/>
< / div >
< div >
< div class = "flex justify-between text-sm mb-1" >
< span
class="text-gray-300"
data-i18n="tools:adjustColors.sepia"
>Sepia< /span
>
< span id = "sepia-value" class = "text-gray-400" > 0< / span >
< / div >
< input
type="range"
id="setting-sepia"
min="0"
max="100"
value="0"
class="w-full accent-indigo-500"
/>
< / div >
< / div >
< / div >
< button
id="process-btn"
class="btn-gradient w-full mt-6"
data-i18n="tools:adjustColors.processButton"
>
Apply Color Adjustments
< / button >
< / div >
< / div >
< / div >
< div
id="loader-modal"
class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50"
>
< div
class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl"
>
< div class = "solid-spinner" > < / div >
< p id = "loader-text" class = "text-white text-lg font-medium" >
Processing...
< / p >
< / div >
< / div >
< div
id="alert-modal"
class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden"
>
< div
class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700"
>
< h3
id="alert-title"
class="text-xl font-bold text-white mb-2"
data-i18n="alert.title"
>
Alert
< / h3 >
< p id = "alert-message" class = "text-gray-300 mb-6" > < / p >
< button
id="alert-ok"
class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200"
>
OK
< / button >
< / div >
< / div >
< section class = "max-w-4xl mx-auto px-4 py-12" >
2026-02-02 16:30:59 +05:30
< h2
class="text-2xl md:text-3xl font-bold text-white mb-8 text-center"
data-i18n="howItWorks.title"
>
2026-02-01 12:21:14 +05:30
How It Works
< / h2 >
< div class = "space-y-6" >
< div class = "flex items-start gap-4" >
< div
class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold"
>
1
< / div >
< div class = "flex-1" >
< h3 class = "text-lg font-semibold text-white mb-1" > Upload File< / h3 >
< p class = "text-gray-400" >
Click or drag and drop your PDF file to begin
< / p >
< / div >
< / div >
< div class = "flex items-start gap-4" >
< div
class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold"
>
2
< / div >
< div class = "flex-1" >
< h3 class = "text-lg font-semibold text-white mb-1" > Adjust Colors< / h3 >
< p class = "text-gray-400" >
Fine-tune color settings with real-time preview
< / p >
< / div >
< / div >
< div class = "flex items-start gap-4" >
< div
class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold"
>
3
< / div >
< div class = "flex-1" >
< h3 class = "text-lg font-semibold text-white mb-1" > Download< / h3 >
< p class = "text-gray-400" > Save your color-adjusted PDF instantly< / p >
< / div >
< / div >
< / div >
< / section >
< section class = "max-w-6xl mx-auto px-4 py-12" >
2026-02-02 16:30:59 +05:30
< h2
class="text-2xl md:text-3xl font-bold text-white mb-6 text-center"
data-i18n="relatedTools.title"
>
2026-02-01 12:21:14 +05:30
Related PDF Tools
< / h2 >
< div class = "grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4" >
< a
href="pdf-to-greyscale.html"
class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700"
>
< h3 class = "text-white font-semibold mb-1" > PDF to Greyscale< / h3 >
< p class = "text-gray-400 text-sm" > Free online greyscale tool< / p >
< / a >
< a
href="invert-colors.html"
class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700"
>
< h3 class = "text-white font-semibold mb-1" > Invert Colors< / h3 >
< p class = "text-gray-400 text-sm" > Free online invert colors tool< / p >
< / a >
< a
href="scanner-effect.html"
class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700"
>
< h3 class = "text-white font-semibold mb-1" > Scanner Effect< / h3 >
< p class = "text-gray-400 text-sm" > Make PDFs look scanned< / p >
< / a >
< a
href="background-color.html"
class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700"
>
< h3 class = "text-white font-semibold mb-1" > Background Color< / h3 >
< p class = "text-gray-400 text-sm" > Change PDF background< / p >
< / a >
< a
href="change-text-color.html"
class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700"
>
< h3 class = "text-white font-semibold mb-1" > Text Color< / h3 >
< p class = "text-gray-400 text-sm" > Change PDF text color< / p >
< / a >
< / div >
< / section >
< section class = "max-w-4xl mx-auto px-4 py-12" >
2026-02-02 16:30:59 +05:30
< h2
class="text-2xl md:text-3xl font-bold text-white mb-6 text-center"
data-i18n="faq.sectionTitle"
>
2026-02-01 12:21:14 +05:30
Frequently Asked Questions
< / h2 >
< div class = "space-y-4" >
< details class = "bg-gray-800 p-5 rounded-lg border border-gray-700" >
< summary
class="cursor-pointer font-semibold text-white flex items-center justify-between"
>
Is adjust colors really free?
< i data-lucide = "chevron-down" class = "w-5 h-5" > < / i >
< / summary >
< p class = "mt-3 text-gray-400" >
Yes! BentoPDF is 100% free with no hidden fees, no signup required,
and unlimited file processing.
< / p >
< / details >
< details class = "bg-gray-800 p-5 rounded-lg border border-gray-700" >
< summary
class="cursor-pointer font-semibold text-white flex items-center justify-between"
>
Are my files private and secure?
< i data-lucide = "chevron-down" class = "w-5 h-5" > < / i >
< / summary >
< p class = "mt-3 text-gray-400" >
Absolutely! All processing happens in your browser. Your files never
leave your device, ensuring complete privacy.
< / p >
< / details >
< details class = "bg-gray-800 p-5 rounded-lg border border-gray-700" >
< summary
class="cursor-pointer font-semibold text-white flex items-center justify-between"
>
Is there a file size limit?
< i data-lucide = "chevron-down" class = "w-5 h-5" > < / i >
< / summary >
< p class = "mt-3 text-gray-400" >
No! Process files of any size, as many times as you want, completely
free.
< / p >
< / details >
< / div >
< / section >
{{> footer }}
< script type = "module" src = "/src/js/utils/lucide-init.ts" > < / script >
< script type = "module" src = "/src/js/utils/full-width.ts" > < / script >
< script type = "module" src = "/src/js/utils/simple-mode-footer.ts" > < / script >
< script type = "module" src = "/src/version.ts" > < / script >
< script type = "module" src = "/src/js/logic/adjust-colors-page.ts" > < / script >
< script type = "module" src = "/src/js/mobileMenu.ts" > < / script >
< script type = "module" src = "/src/js/main.ts" > < / script >
< script type = "application/ld+json" >
{
"@context": "https://schema.org",
"@type": "SoftwareApplication",
"name": "Adjust Colors - BentoPDF",
"applicationCategory": "PDF Tool",
"operatingSystem": "Any - Web Browser",
"offers": {
"@type": "Offer",
"price": "0",
"priceCurrency": "USD"
},
"aggregateRating": {
"@type": "AggregateRating",
"ratingValue": "4.7",
"ratingCount": "1856"
}
}
< / script >
< script type = "application/ld+json" >
{
"@context": "https://schema.org",
"@type": "HowTo",
"name": "How to adjust PDF colors online",
"description": "Learn how to adjust PDF colors using BentoPDF",
"step": [
{
"@type": "HowToStep",
"position": 1,
"name": "Upload File",
"text": "Click or drag and drop your PDF file"
},
{
"@type": "HowToStep",
"position": 2,
"name": "Adjust Colors",
"text": "Fine-tune brightness, contrast, saturation, hue and more with live preview"
},
{
"@type": "HowToStep",
"position": 3,
"name": "Download",
"text": "Download your color-adjusted PDF"
}
]
}
< / script >
< script type = "application/ld+json" >
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [
{
"@type": "ListItem",
"position": 1,
"name": "Home",
"item": "https://www.bentopdf.com"
},
{
"@type": "ListItem",
"position": 2,
"name": "Adjust Colors",
"item": "https://www.bentopdf.com/adjust-colors"
}
]
}
< / script >
< / body >
< / html >
