{"id":1024,"date":"2026-10-26T17:23:29","date_gmt":"2026-10-26T17:23:29","guid":{"rendered":"https:\/\/srabons.de\/?page_id=1024"},"modified":"2026-10-26T17:23:31","modified_gmt":"2026-10-26T17:23:31","slug":"image-to-pdf-converter","status":"publish","type":"page","link":"https:\/\/srabons.de\/en\/image-to-pdf-converter\/","title":{"rendered":"Image to PDF converter"},"content":{"rendered":"\n<!DOCTYPE html>\n<html lang=\"en\" class=\"scroll-smooth\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>Srabons.de | Fast &#038; Secure Image to PDF Converter<\/title>\n    <!-- Tailwind CSS CDN -->\n    <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n    <script>\n        tailwind.config = {\n            theme: {\n                extend: {\n                    colors: {\n                        brand: {\n                            50: '#f0fdfa',\n                            100: '#ccfbf1',\n                            200: '#99f6e4',\n                            500: '#14b8a6',\n                            600: '#0d9488',\n                            700: '#0f766e',\n                            800: '#115e59',\n                            900: '#134e4a',\n                        }\n                    },\n                    fontFamily: {\n                        sans: ['Inter', 'system-ui', '-apple-system', 'sans-serif'],\n                    }\n                }\n            }\n        }\n    <\/script>\n    <!-- Google Fonts: Inter -->\n    <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n    <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;500;600;700;800&#038;display=swap\" rel=\"stylesheet\">\n    <!-- FontAwesome CDN -->\n    <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.1\/css\/all.min.css\">\n    <!-- jsPDF CDN -->\n    <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jspdf\/2.5.1\/jspdf.umd.min.js\"><\/script>\n\n    <style>\n        body {\n            font-family: 'Inter', sans-serif;\n        }\n        \/* Custom scrollbar *\/\n        ::-webkit-scrollbar {\n            width: 8px;\n            height: 8px;\n        }\n        ::-webkit-scrollbar-track {\n            background: #f1f5f9;\n        }\n        ::-webkit-scrollbar-thumb {\n            background: #cbd5e1;\n            border-radius: 9999px;\n        }\n        ::-webkit-scrollbar-thumb:hover {\n            background: #94a3b8;\n        }\n        .drag-card-active {\n            opacity: 0.5;\n            transform: scale(0.98);\n        }\n        .drop-target {\n            outline: 2px dashed #0d9488;\n            outline-offset: 4px;\n        }\n    <\/style>\n<\/head>\n<body class=\"bg-slate-50 text-slate-800 antialiased min-h-screen flex flex-col justify-between selection:bg-brand-500 selection:text-white\">\n\n    <!-- Header Navigation -->\n    <header class=\"sticky top-0 z-40 bg-white\/90 backdrop-blur-md border-b border-slate-200\">\n        <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 h-16 flex items-center justify-between\">\n            <!-- Brand Logo -->\n            <a href=\"#\" class=\"flex items-center gap-2.5 group\">\n                <div class=\"w-10 h-10 rounded-xl bg-gradient-to-tr from-brand-700 to-teal-400 flex items-center justify-center text-white shadow-md shadow-brand-500\/20 group-hover:scale-105 transition-transform duration-200\">\n                    <i class=\"fa-solid fa-file-pdf text-xl\"><\/i>\n                <\/div>\n                <div>\n                    <span class=\"text-xl font-extrabold tracking-tight text-slate-900 flex items-center gap-1\">\n                        Srabons<span class=\"text-brand-600\">.de<\/span>\n                    <\/span>\n                    <span class=\"hidden sm:block text-[10px] uppercase font-semibold text-slate-400 tracking-wider\">Fast &#038; Secure PDF Suite<\/span>\n                <\/div>\n            <\/a>\n\n            <!-- Nav Links -->\n            <nav class=\"hidden md:flex items-center gap-8 text-sm font-medium text-slate-600\">\n                <a href=\"#converter\" class=\"hover:text-brand-600 transition-colors\">Converter<\/a>\n                <a href=\"#how-it-works\" class=\"hover:text-brand-600 transition-colors\">How it works<\/a>\n                <a href=\"#security\" class=\"hover:text-brand-600 transition-colors\">Security &#038; Privacy<\/a>\n                <a href=\"#faq\" class=\"hover:text-brand-600 transition-colors\">FAQ<\/a>\n            <\/nav>\n\n            <!-- Actions \/ Badge -->\n            <div class=\"flex items-center gap-3\">\n                <span class=\"inline-flex items-center gap-1.5 px-3 py-1 rounded-full text-xs font-semibold bg-emerald-50 text-emerald-700 border border-emerald-200\">\n                    <i class=\"fa-solid fa-shield-halved text-emerald-600\"><\/i>\n                    <span class=\"hidden sm:inline\">100% Client-Side Safe<\/span>\n                    <span class=\"sm:hidden\">Private<\/span>\n                <\/span>\n                <a href=\"#converter\" class=\"bg-brand-600 hover:bg-brand-700 text-white text-xs sm:text-sm font-semibold px-4 py-2 rounded-lg shadow-sm hover:shadow transition-all\">\n                    Start Converting\n                <\/a>\n            <\/div>\n        <\/div>\n    <\/header>\n\n    <!-- Main Content -->\n    <main class=\"flex-grow\">\n        <!-- Hero Section -->\n        <section class=\"relative pt-10 pb-8 px-4 sm:px-6 lg:px-8 text-center max-w-4xl mx-auto\">\n            <div class=\"inline-flex items-center gap-2 px-3 py-1.5 rounded-full bg-brand-50 border border-brand-200 text-brand-800 text-xs font-medium mb-4\">\n                <i class=\"fa-solid fa-bolt text-brand-600\"><\/i> Lightning Fast &bull; Unlimited Files &bull; Zero Cloud Uploads\n            <\/div>\n            <h1 class=\"text-3xl sm:text-5xl font-black text-slate-900 tracking-tight leading-tight mb-4\">\n                Convert Images to PDF <span class=\"bg-gradient-to-r from-brand-600 to-teal-500 bg-clip-text text-transparent\">Instantly<\/span>\n            <\/h1>\n            <p class=\"text-base sm:text-lg text-slate-600 max-w-2xl mx-auto\">\n                Turn your JPG, PNG, WEBP, or BMP photos into a crisp, high-resolution PDF file. All processing is executed right inside your browser for total privacy.\n            <\/p>\n\n            <!-- Trust Highlights -->\n            <div class=\"grid grid-cols-2 sm:grid-cols-3 gap-3 max-w-xl mx-auto mt-6 text-xs text-slate-600 font-medium\">\n                <div class=\"flex items-center justify-center gap-2 bg-white p-2 rounded-lg border border-slate-200\/80 shadow-xs\">\n                    <i class=\"fa-solid fa-lock text-brand-600\"><\/i> No files sent to server\n                <\/div>\n                <div class=\"flex items-center justify-center gap-2 bg-white p-2 rounded-lg border border-slate-200\/80 shadow-xs\">\n                    <i class=\"fa-solid fa-gauge-high text-brand-600\"><\/i> Instant conversion\n                <\/div>\n                <div class=\"col-span-2 sm:col-span-1 flex items-center justify-center gap-2 bg-white p-2 rounded-lg border border-slate-200\/80 shadow-xs\">\n                    <i class=\"fa-solid fa-infinity text-brand-600\"><\/i> Free &#038; unlimited\n                <\/div>\n            <\/div>\n        <\/section>\n\n        <!-- Converter App Container -->\n        <section id=\"converter\" class=\"max-w-6xl mx-auto px-4 sm:px-6 lg:px-8 pb-16\">\n            <div class=\"bg-white rounded-2xl shadow-xl border border-slate-200\/80 overflow-hidden\">\n                \n                <!-- Step 1: Drop Zone -->\n                <div class=\"p-6 sm:p-8 border-b border-slate-100\">\n                    <div id=\"dropZone\" class=\"group relative border-2 border-dashed border-slate-300 hover:border-brand-500 rounded-2xl p-8 sm:p-12 text-center transition-all duration-200 bg-slate-50 hover:bg-brand-50\/30 cursor-pointer\">\n                        <input type=\"file\" id=\"fileInput\" multiple accept=\"image\/png, image\/jpeg, image\/webp, image\/bmp, image\/gif\" class=\"absolute inset-0 w-full h-full opacity-0 cursor-pointer z-10\">\n                        <div class=\"flex flex-col items-center justify-center pointer-events-none\">\n                            <div class=\"w-16 h-16 mb-4 rounded-full bg-brand-100 text-brand-600 flex items-center justify-center text-2xl group-hover:scale-110 transition-transform duration-200 shadow-sm\">\n                                <i class=\"fa-solid fa-cloud-arrow-up\"><\/i>\n                            <\/div>\n                            <h3 class=\"text-lg sm:text-xl font-bold text-slate-800 mb-1\">\n                                Drag &#038; drop your images here\n                            <\/h3>\n                            <p class=\"text-sm text-slate-500 mb-4\">\n                                Supports JPG, PNG, WEBP, BMP, or GIF\n                            <\/p>\n                            <button type=\"button\" class=\"inline-flex items-center gap-2 px-5 py-2.5 rounded-xl bg-brand-600 hover:bg-brand-700 text-white font-semibold text-sm shadow-md shadow-brand-500\/20 transition-all pointer-events-auto\">\n                                <i class=\"fa-regular fa-images\"><\/i> Choose Images\n                            <\/button>\n                        <\/div>\n                    <\/div>\n                <\/div>\n\n                <!-- Step 2: Workspace & Settings (Hidden when empty) -->\n                <div id=\"workspaceArea\" class=\"hidden\">\n                    <div class=\"grid grid-cols-1 lg:grid-cols-3 divide-y lg:divide-y-0 lg:divide-x divide-slate-200\">\n                        \n                        <!-- Left 2 Cols: Images Grid & Reordering -->\n                        <div class=\"lg:col-span-2 p-6 sm:p-8 bg-slate-50\/50\">\n                            <div class=\"flex flex-wrap items-center justify-between gap-4 mb-4\">\n                                <div>\n                                    <h4 class=\"text-base font-bold text-slate-900 flex items-center gap-2\">\n                                        <span>Selected Images<\/span>\n                                        <span id=\"fileCountBadge\" class=\"bg-brand-100 text-brand-800 text-xs px-2.5 py-0.5 rounded-full font-bold\">0<\/span>\n                                    <\/h4>\n                                    <p class=\"text-xs text-slate-500\">Drag items or use arrow controls to rearrange page sequence.<\/p>\n                                <\/div>\n                                <div class=\"flex items-center gap-2\">\n                                    <label for=\"addMoreInput\" class=\"cursor-pointer inline-flex items-center gap-1.5 px-3 py-1.5 rounded-lg border border-slate-300 hover:border-slate-400 bg-white text-xs font-semibold text-slate-700 shadow-xs hover:bg-slate-50 transition-all\">\n                                        <i class=\"fa-solid fa-plus text-brand-600\"><\/i> Add More\n                                        <input type=\"file\" id=\"addMoreInput\" multiple accept=\"image\/*\" class=\"hidden\">\n                                    <\/label>\n                                    <button id=\"clearAllBtn\" type=\"button\" class=\"inline-flex items-center gap-1.5 px-3 py-1.5 rounded-lg border border-rose-200 hover:border-rose-300 bg-rose-50 hover:bg-rose-100 text-xs font-semibold text-rose-700 transition-all\">\n                                        <i class=\"fa-solid fa-trash-can\"><\/i> Clear All\n                                    <\/button>\n                                <\/div>\n                            <\/div>\n\n                            <!-- Thumbnails Grid -->\n                            <div id=\"imagesGrid\" class=\"grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-4 max-h-[520px] overflow-y-auto p-1\">\n                                <!-- Cards will be injected dynamically -->\n                            <\/div>\n                        <\/div>\n\n                        <!-- Right 1 Col: Settings & Convert Panel -->\n                        <div class=\"p-6 sm:p-8 flex flex-col justify-between bg-white\">\n                            <div>\n                                <h4 class=\"text-base font-bold text-slate-900 mb-4 pb-2 border-b border-slate-100 flex items-center gap-2\">\n                                    <i class=\"fa-solid fa-sliders text-brand-600\"><\/i> PDF Options\n                                <\/h4>\n\n                                <!-- Settings Form -->\n                                <div class=\"space-y-4 text-sm\">\n                                    <!-- Page Orientation -->\n                                    <div>\n                                        <label class=\"block font-semibold text-slate-700 mb-1.5\">Page Orientation<\/label>\n                                        <div class=\"grid grid-cols-3 gap-1.5 bg-slate-100 p-1 rounded-xl\">\n                                            <button type=\"button\" data-val=\"auto\" class=\"orient-btn py-1.5 px-2 text-xs font-semibold rounded-lg bg-white text-slate-900 shadow-xs transition-all\">Auto<\/button>\n                                            <button type=\"button\" data-val=\"portrait\" class=\"orient-btn py-1.5 px-2 text-xs font-medium text-slate-600 hover:text-slate-900 transition-all\">Portrait<\/button>\n                                            <button type=\"button\" data-val=\"landscape\" class=\"orient-btn py-1.5 px-2 text-xs font-medium text-slate-600 hover:text-slate-900 transition-all\">Landscape<\/button>\n                                        <\/div>\n                                    <\/div>\n\n                                    <!-- Page Size -->\n                                    <div>\n                                        <label for=\"pageSize\" class=\"block font-semibold text-slate-700 mb-1\">Page Size<\/label>\n                                        <select id=\"pageSize\" class=\"w-full bg-slate-50 border border-slate-300 text-slate-800 text-xs sm:text-sm rounded-xl px-3 py-2 focus:ring-2 focus:ring-brand-500 focus:border-brand-500 outline-none\">\n                                            <option value=\"a4\" selected>A4 (Standard 210 x 297 mm)<\/option>\n                                            <option value=\"letter\">US Letter (8.5 x 11 in)<\/option>\n                                            <option value=\"fit\">Fit to Image Size<\/option>\n                                        <\/select>\n                                    <\/div>\n\n                                    <!-- Margins -->\n                                    <div>\n                                        <label for=\"pageMargin\" class=\"block font-semibold text-slate-700 mb-1\">Margins<\/label>\n                                        <select id=\"pageMargin\" class=\"w-full bg-slate-50 border border-slate-300 text-slate-800 text-xs sm:text-sm rounded-xl px-3 py-2 focus:ring-2 focus:ring-brand-500 focus:border-brand-500 outline-none\">\n                                            <option value=\"0\">No Margin (Border to Border)<\/option>\n                                            <option value=\"8\" selected>Small Margin (8 mm)<\/option>\n                                            <option value=\"15\">Normal Margin (15 mm)<\/option>\n                                        <\/select>\n                                    <\/div>\n\n                                    <!-- Quality \/ Compression Slider -->\n                                    <div>\n                                        <div class=\"flex items-center justify-between mb-1\">\n                                            <label for=\"imgQuality\" class=\"font-semibold text-slate-700\">Image Compression<\/label>\n                                            <span id=\"qualityValDisplay\" class=\"text-xs font-bold text-brand-700\">85% (High)<\/span>\n                                        <\/div>\n                                        <input type=\"range\" id=\"imgQuality\" min=\"30\" max=\"100\" value=\"85\" step=\"5\" class=\"w-full accent-brand-600 h-2 bg-slate-200 rounded-lg cursor-pointer\">\n                                        <div class=\"flex justify-between text-[11px] text-slate-400 mt-1\">\n                                            <span>Smaller Size<\/span>\n                                            <span>Best Quality<\/span>\n                                        <\/div>\n                                    <\/div>\n\n                                    <!-- Custom Output Filename -->\n                                    <div>\n                                        <label for=\"pdfFilename\" class=\"block font-semibold text-slate-700 mb-1\">Filename<\/label>\n                                        <div class=\"relative\">\n                                            <input type=\"text\" id=\"pdfFilename\" value=\"srabons-converted\" class=\"w-full bg-slate-50 border border-slate-300 text-slate-800 text-xs sm:text-sm rounded-xl pl-3 pr-12 py-2 focus:ring-2 focus:ring-brand-500 focus:border-brand-500 outline-none\">\n                                            <span class=\"absolute right-3 top-2 text-xs font-medium text-slate-400\">.pdf<\/span>\n                                        <\/div>\n                                    <\/div>\n                                <\/div>\n                            <\/div>\n\n                            <!-- Action Button & Progress -->\n                            <div class=\"mt-8 pt-6 border-t border-slate-100\">\n                                <!-- Progress Bar (Hidden during idle) -->\n                                <div id=\"progressContainer\" class=\"hidden mb-4\">\n                                    <div class=\"flex justify-between text-xs font-semibold text-slate-600 mb-1\">\n                                        <span id=\"progressText\">Processing image 1 of 3&#8230;<\/span>\n                                        <span id=\"progressPercent\">33%<\/span>\n                                    <\/div>\n                                    <div class=\"w-full bg-slate-200 rounded-full h-2 overflow-hidden\">\n                                        <div id=\"progressBar\" class=\"bg-brand-600 h-2 rounded-full transition-all duration-200\" style=\"width: 0%\"><\/div>\n                                    <\/div>\n                                <\/div>\n\n                                <button id=\"generatePdfBtn\" class=\"w-full py-3.5 px-4 rounded-xl bg-gradient-to-r from-brand-600 to-teal-600 hover:from-brand-700 hover:to-teal-700 text-white font-bold text-sm sm:text-base shadow-lg shadow-brand-500\/25 flex items-center justify-center gap-2 transition-all transform active:scale-[0.99]\">\n                                    <i class=\"fa-solid fa-file-export\"><\/i>\n                                    <span>Generate &#038; Download PDF<\/span>\n                                <\/button>\n                                <p class=\"text-center text-[11px] text-slate-400 mt-2\">\n                                    Generated securely in your browser &bull; Srabons.de\n                                <\/p>\n                            <\/div>\n                        <\/div>\n\n                    <\/div>\n                <\/div>\n\n            <\/div>\n        <\/section>\n\n        <!-- Preview Modal -->\n        <div id=\"previewModal\" class=\"fixed inset-0 z-50 hidden bg-slate-900\/60 backdrop-blur-sm flex items-center justify-center p-4\">\n            <div class=\"bg-white rounded-2xl shadow-2xl max-w-4xl w-full flex flex-col max-h-[90vh] overflow-hidden\">\n                <div class=\"px-6 py-4 border-b border-slate-200 flex items-center justify-between bg-slate-50\">\n                    <div class=\"flex items-center gap-2\">\n                        <i class=\"fa-solid fa-circle-check text-emerald-600 text-lg\"><\/i>\n                        <h3 class=\"font-bold text-slate-800 text-base\">PDF Ready for Download!<\/h3>\n                    <\/div>\n                    <button id=\"closeModalBtn\" class=\"text-slate-400 hover:text-slate-600 p-1.5 rounded-lg hover:bg-slate-200 transition-colors\">\n                        <i class=\"fa-solid fa-xmark text-lg\"><\/i>\n                    <\/button>\n                <\/div>\n                <div class=\"flex-grow p-4 bg-slate-100 flex items-center justify-center min-h-[400px]\">\n                    <iframe id=\"pdfPreviewFrame\" class=\"w-full h-full min-h-[450px] rounded-lg border border-slate-300 shadow-sm\" src=\"\"><\/iframe>\n                <\/div>\n                <div class=\"px-6 py-4 border-t border-slate-200 flex flex-wrap items-center justify-between gap-3 bg-white\">\n                    <span id=\"pdfFileSizeBadge\" class=\"text-xs font-semibold text-slate-500\">File size: ~<\/span>\n                    <div class=\"flex items-center gap-3\">\n                        <button id=\"modalCloseActionBtn\" class=\"px-4 py-2 rounded-xl text-slate-600 hover:bg-slate-100 font-semibold text-xs sm:text-sm\">\n                            Close\n                        <\/button>\n                        <a id=\"modalDownloadBtn\" href=\"#\" download=\"srabons.pdf\" class=\"inline-flex items-center gap-2 px-5 py-2 rounded-xl bg-brand-600 hover:bg-brand-700 text-white font-bold text-xs sm:text-sm shadow-md transition-all\">\n                            <i class=\"fa-solid fa-download\"><\/i> Download PDF\n                        <\/a>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n\n        <!-- How It Works Section -->\n        <section id=\"how-it-works\" class=\"py-16 bg-white border-y border-slate-200\">\n            <div class=\"max-w-6xl mx-auto px-4 sm:px-6 lg:px-8\">\n                <div class=\"text-center max-w-2xl mx-auto mb-12\">\n                    <h2 class=\"text-xs uppercase font-extrabold tracking-widest text-brand-600 mb-1\">Simple 3-Step Process<\/h2>\n                    <h3 class=\"text-2xl sm:text-3xl font-extrabold text-slate-900 tracking-tight\">How to Convert Images to PDF<\/h3>\n                    <p class=\"text-slate-500 text-sm mt-2\">Convert an unlimited number of photos into a clean document in under 10 seconds.<\/p>\n                <\/div>\n\n                <div class=\"grid grid-cols-1 md:grid-cols-3 gap-8\">\n                    <div class=\"bg-slate-50 rounded-2xl p-6 border border-slate-200\/80 hover:shadow-md transition-shadow relative\">\n                        <span class=\"w-9 h-9 rounded-full bg-brand-600 text-white flex items-center justify-center font-black text-sm mb-4\">1<\/span>\n                        <h4 class=\"text-lg font-bold text-slate-900 mb-2\">Select Your Photos<\/h4>\n                        <p class=\"text-sm text-slate-600\">Drag &#038; drop your files or browse from your desktop or phone. Supports all key picture formats.<\/p>\n                    <\/div>\n\n                    <div class=\"bg-slate-50 rounded-2xl p-6 border border-slate-200\/80 hover:shadow-md transition-shadow relative\">\n                        <span class=\"w-9 h-9 rounded-full bg-brand-600 text-white flex items-center justify-center font-black text-sm mb-4\">2<\/span>\n                        <h4 class=\"text-lg font-bold text-slate-900 mb-2\">Reorder &#038; Customize<\/h4>\n                        <p class=\"text-sm text-slate-600\">Drag tiles to organize the exact page sequence. Fine-tune page margins, orientation, and image quality.<\/p>\n                    <\/div>\n\n                    <div class=\"bg-slate-50 rounded-2xl p-6 border border-slate-200\/80 hover:shadow-md transition-shadow relative\">\n                        <span class=\"w-9 h-9 rounded-full bg-brand-600 text-white flex items-center justify-center font-black text-sm mb-4\">3<\/span>\n                        <h4 class=\"text-lg font-bold text-slate-900 mb-2\">Download Your PDF<\/h4>\n                        <p class=\"text-sm text-slate-600\">Click generate and obtain your consolidated PDF immediately without watermarks or file queues.<\/p>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/section>\n\n        <!-- Security & Privacy Section -->\n        <section id=\"security\" class=\"py-16 bg-slate-50\">\n            <div class=\"max-w-5xl mx-auto px-4 sm:px-6 lg:px-8\">\n                <div class=\"bg-gradient-to-br from-slate-900 to-slate-800 rounded-3xl p-8 sm:p-12 text-white shadow-xl flex flex-col md:flex-row items-center gap-8\">\n                    <div class=\"w-20 h-20 shrink-0 rounded-2xl bg-brand-500\/20 border border-brand-400\/30 flex items-center justify-center text-4xl text-teal-400\">\n                        <i class=\"fa-solid fa-user-shield\"><\/i>\n                    <\/div>\n                    <div class=\"space-y-3\">\n                        <h3 class=\"text-2xl font-bold tracking-tight\">Zero Server Uploads &bull; Total Privacy Guaranteed<\/h3>\n                        <p class=\"text-slate-300 text-sm leading-relaxed\">\n                            Unlike traditional converters that transmit your sensitive documents, IDs, or receipts to third-party cloud servers, \n                            <strong class=\"text-white\">Srabons.de<\/strong> processes every byte directly inside your browser&#8217;s local sandbox memory. \n                            Your photos never leave your device.\n                        <\/p>\n                        <div class=\"flex flex-wrap gap-4 pt-2 text-xs font-semibold text-slate-200\">\n                            <span class=\"flex items-center gap-1.5\"><i class=\"fa-solid fa-check text-brand-400\"><\/i> GDPR Compliant<\/span>\n                            <span class=\"flex items-center gap-1.5\"><i class=\"fa-solid fa-check text-brand-400\"><\/i> No Data Storage<\/span>\n                            <span class=\"flex items-center gap-1.5\"><i class=\"fa-solid fa-check text-brand-400\"><\/i> Offline Capable<\/span>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/section>\n\n        <!-- FAQ Section -->\n        <section id=\"faq\" class=\"py-16 bg-white border-t border-slate-200\">\n            <div class=\"max-w-4xl mx-auto px-4 sm:px-6 lg:px-8\">\n                <div class=\"text-center mb-10\">\n                    <h2 class=\"text-2xl sm:text-3xl font-extrabold text-slate-900 tracking-tight\">Frequently Asked Questions<\/h2>\n                    <p class=\"text-slate-500 text-sm mt-1\">Everything you need to know about our free Image to PDF utility.<\/p>\n                <\/div>\n\n                <div class=\"space-y-3\" id=\"faqAccordion\">\n                    <div class=\"border border-slate-200 rounded-xl overflow-hidden\">\n                        <button class=\"w-full p-4 text-left font-semibold text-slate-800 flex justify-between items-center hover:bg-slate-50 transition-colors\" onclick=\"toggleFaq(this)\">\n                            <span>Is it safe to convert private documents like passports or bank receipts?<\/span>\n                            <i class=\"fa-solid fa-chevron-down text-xs text-slate-400 transition-transform\"><\/i>\n                        <\/button>\n                        <div class=\"p-4 pt-0 text-sm text-slate-600 hidden\">\n                            Yes, absolutely. The conversion runs strictly via client-side JavaScript (jsPDF). Nothing is uploaded over the internet or logged on any server.\n                        <\/div>\n                    <\/div>\n\n                    <div class=\"border border-slate-200 rounded-xl overflow-hidden\">\n                        <button class=\"w-full p-4 text-left font-semibold text-slate-800 flex justify-between items-center hover:bg-slate-50 transition-colors\" onclick=\"toggleFaq(this)\">\n                            <span>Is there any limit to the number of images I can convert?<\/span>\n                            <i class=\"fa-solid fa-chevron-down text-xs text-slate-400 transition-transform\"><\/i>\n                        <\/button>\n                        <div class=\"p-4 pt-0 text-sm text-slate-600 hidden\">\n                            No hard limits exist! Because processing uses your computer or phone&#8217;s memory, you can batch convert dozens of images without restriction.\n                        <\/div>\n                    <\/div>\n\n                    <div class=\"border border-slate-200 rounded-xl overflow-hidden\">\n                        <button class=\"w-full p-4 text-left font-semibold text-slate-800 flex justify-between items-center hover:bg-slate-50 transition-colors\" onclick=\"toggleFaq(this)\">\n                            <span>Can I rearrange the order of pages before creating the PDF?<\/span>\n                            <i class=\"fa-solid fa-chevron-down text-xs text-slate-400 transition-transform\"><\/i>\n                        <\/button>\n                        <div class=\"p-4 pt-0 text-sm text-slate-600 hidden\">\n                            Yes! Each uploaded image card features left\/right (or up\/down) rearrangement buttons as well as smooth drag-and-drop support so you get the exact order needed.\n                        <\/div>\n                    <\/div>\n\n                    <div class=\"border border-slate-200 rounded-xl overflow-hidden\">\n                        <button class=\"w-full p-4 text-left font-semibold text-slate-800 flex justify-between items-center hover:bg-slate-50 transition-colors\" onclick=\"toggleFaq(this)\">\n                            <span>Does Srabons.de put watermarks on my generated files?<\/span>\n                            <i class=\"fa-solid fa-chevron-down text-xs text-slate-400 transition-transform\"><\/i>\n                        <\/button>\n                        <div class=\"p-4 pt-0 text-sm text-slate-600 hidden\">\n                            Never. Generated documents are completely clean, professional, and free from any watermark or branding.\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/section>\n    <\/main>\n\n    <!-- Footer -->\n    <footer class=\"bg-slate-900 text-slate-400 text-sm py-12 border-t border-slate-800\">\n        <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\n            <div class=\"flex flex-col md:flex-row justify-between items-center gap-6 pb-8 border-b border-slate-800\">\n                <div class=\"flex items-center gap-2\">\n                    <div class=\"w-8 h-8 rounded-lg bg-brand-600 flex items-center justify-center text-white font-bold\">\n                        <i class=\"fa-solid fa-file-pdf\"><\/i>\n                    <\/div>\n                    <span class=\"text-white text-lg font-bold\">Srabons<span class=\"text-brand-500\">.de<\/span><\/span>\n                <\/div>\n                <div class=\"flex flex-wrap items-center gap-6 text-xs sm:text-sm\">\n                    <a href=\"#converter\" class=\"hover:text-white transition-colors\">Converter<\/a>\n                    <a href=\"#how-it-works\" class=\"hover:text-white transition-colors\">Guide<\/a>\n                    <a href=\"#security\" class=\"hover:text-white transition-colors\">Security<\/a>\n                    <a href=\"#faq\" class=\"hover:text-white transition-colors\">FAQ<\/a>\n                    <a href=\"#\" class=\"hover:text-white transition-colors\">Privacy Notice<\/a>\n                <\/div>\n            <\/div>\n            <div class=\"pt-8 flex flex-col sm:flex-row items-center justify-between text-xs text-slate-500 gap-4\">\n                <p>&copy; <span id=\"currentYear\"><\/span> Srabons.de &bull; All rights reserved. Built for security &#038; speed.<\/p>\n                <p class=\"flex items-center gap-1\">\n                    Made with <i class=\"fa-solid fa-shield-heart text-brand-500\"><\/i> 100% Client-side technology\n                <\/p>\n            <\/div>\n        <\/div>\n    <\/footer>\n\n    <!-- Application Logic -->\n    <script>\n        \/\/ Set dynamic copyright year\n        document.getElementById('currentYear').textContent = new Date().getFullYear();\n\n        \/\/ Application State\n        let uploadedImages = []; \/\/ Stores { id, file, url, name, sizeFormatted, width, height }\n        let currentOrientation = 'auto'; \/\/ 'auto' | 'portrait' | 'landscape'\n        let draggedIndex = null;\n        let generatedBlobUrl = null;\n\n        \/\/ Elements\n        const dropZone = document.getElementById('dropZone');\n        const fileInput = document.getElementById('fileInput');\n        const addMoreInput = document.getElementById('addMoreInput');\n        const workspaceArea = document.getElementById('workspaceArea');\n        const imagesGrid = document.getElementById('imagesGrid');\n        const fileCountBadge = document.getElementById('fileCountBadge');\n        const clearAllBtn = document.getElementById('clearAllBtn');\n        const generatePdfBtn = document.getElementById('generatePdfBtn');\n        const progressContainer = document.getElementById('progressContainer');\n        const progressBar = document.getElementById('progressBar');\n        const progressText = document.getElementById('progressText');\n        const progressPercent = document.getElementById('progressPercent');\n        const imgQualityInput = document.getElementById('imgQuality');\n        const qualityValDisplay = document.getElementById('qualityValDisplay');\n        const pageSizeSelect = document.getElementById('pageSize');\n        const pageMarginSelect = document.getElementById('pageMargin');\n        const pdfFilenameInput = document.getElementById('pdfFilename');\n\n        \/\/ Modal Elements\n        const previewModal = document.getElementById('previewModal');\n        const closeModalBtn = document.getElementById('closeModalBtn');\n        const modalCloseActionBtn = document.getElementById('modalCloseActionBtn');\n        const modalDownloadBtn = document.getElementById('modalDownloadBtn');\n        const pdfPreviewFrame = document.getElementById('pdfPreviewFrame');\n        const pdfFileSizeBadge = document.getElementById('pdfFileSizeBadge');\n\n        \/\/ Orientation Buttons Logic\n        const orientButtons = document.querySelectorAll('.orient-btn');\n        orientButtons.forEach(btn => {\n            btn.addEventListener('click', () => {\n                orientButtons.forEach(b => {\n                    b.classList.remove('bg-white', 'text-slate-900', 'shadow-xs', 'font-semibold');\n                    b.classList.add('text-slate-600', 'font-medium');\n                });\n                btn.classList.add('bg-white', 'text-slate-900', 'shadow-xs', 'font-semibold');\n                btn.classList.remove('text-slate-600', 'font-medium');\n                currentOrientation = btn.getAttribute('data-val');\n            });\n        });\n\n        \/\/ Compression Display update\n        imgQualityInput.addEventListener('input', (e) => {\n            const val = e.target.value;\n            let label = 'Medium';\n            if (val >= 85) label = 'High';\n            else if (val <= 50) label = 'Low (Smallest)';\n            qualityValDisplay.textContent = `${val}% (${label})`;\n        });\n\n        \/\/ Drag &#038; Drop Handlers\n        ['dragenter', 'dragover'].forEach(eventName => {\n            dropZone.addEventListener(eventName, (e) => {\n                e.preventDefault();\n                dropZone.classList.add('border-brand-500', 'bg-brand-50');\n            }, false);\n        });\n\n        ['dragleave', 'drop'].forEach(eventName => {\n            dropZone.addEventListener(eventName, (e) => {\n                e.preventDefault();\n                dropZone.classList.remove('border-brand-500', 'bg-brand-50');\n            }, false);\n        });\n\n        dropZone.addEventListener('drop', (e) => {\n            const dt = e.dataTransfer;\n            const files = dt.files;\n            handleFiles(files);\n        });\n\n        fileInput.addEventListener('change', (e) => {\n            handleFiles(e.target.files);\n            fileInput.value = '';\n        });\n\n        addMoreInput.addEventListener('change', (e) => {\n            handleFiles(e.target.files);\n            addMoreInput.value = '';\n        });\n\n        clearAllBtn.addEventListener('click', () => {\n            uploadedImages.forEach(img => URL.revokeObjectURL(img.url));\n            uploadedImages = [];\n            renderImages();\n        });\n\n        \/\/ Format File Size\n        function formatBytes(bytes) {\n            if (bytes === 0) return '0 B';\n            const k = 1024;\n            const sizes = ['B', 'KB', 'MB', 'GB'];\n            const i = Math.floor(Math.log(bytes) \/ Math.log(k));\n            return parseFloat((bytes \/ Math.pow(k, i)).toFixed(1)) + ' ' + sizes[i];\n        }\n\n        \/\/ Process File List\n        function handleFiles(files) {\n            const validTypes = ['image\/jpeg', 'image\/png', 'image\/webp', 'image\/bmp', 'image\/gif'];\n            Array.from(files).forEach(file => {\n                if (!validTypes.includes(file.type) && !file.type.startsWith('image\/')) {\n                    return;\n                }\n                const url = URL.createObjectURL(file);\n                const img = new Image();\n                img.onload = () => {\n                    uploadedImages.push({\n                        id: 'img_' + Math.random().toString(36).substr(2, 9),\n                        file: file,\n                        url: url,\n                        name: file.name,\n                        sizeFormatted: formatBytes(file.size),\n                        width: img.naturalWidth,\n                        height: img.naturalHeight\n                    });\n                    renderImages();\n                };\n                img.src = url;\n            });\n        }\n\n        \/\/ Render Cards\n        function renderImages() {\n            fileCountBadge.textContent = uploadedImages.length;\n            if (uploadedImages.length === 0) {\n                workspaceArea.classList.add('hidden');\n                return;\n            }\n            workspaceArea.classList.remove('hidden');\n            imagesGrid.innerHTML = '';\n\n            uploadedImages.forEach((item, index) => {\n                const card = document.createElement('div');\n                card.className = 'group relative bg-white border border-slate-200 rounded-xl overflow-hidden shadow-xs hover:shadow-md transition-all flex flex-col';\n                card.draggable = true;\n                card.dataset.index = index;\n\n                card.innerHTML = `\n                    <div class=\"relative bg-slate-100 aspect-square overflow-hidden flex items-center justify-center p-2\">\n                        <img decoding=\"async\" src=\"${item.url}\" alt=\"${item.name}\" class=\"max-h-full max-w-full object-contain pointer-events-none rounded\">\n                        <span class=\"absolute top-2 left-2 bg-slate-900\/70 text-white text-[10px] font-bold px-1.5 py-0.5 rounded backdrop-blur-xs\">\n                            #${index + 1}\n                        <\/span>\n                        <div class=\"absolute inset-0 bg-slate-900\/40 opacity-0 group-hover:opacity-100 transition-opacity flex items-center justify-center gap-2\">\n                            <button title=\"Move Left\" class=\"btn-move-left p-1.5 bg-white\/90 hover:bg-white text-slate-800 rounded-lg text-xs shadow-sm ${index === 0 ? 'opacity-40 cursor-not-allowed' : ''}\">\n                                <i class=\"fa-solid fa-arrow-left\"><\/i>\n                            <\/button>\n                            <button title=\"Move Right\" class=\"btn-move-right p-1.5 bg-white\/90 hover:bg-white text-slate-800 rounded-lg text-xs shadow-sm ${index === uploadedImages.length - 1 ? 'opacity-40 cursor-not-allowed' : ''}\">\n                                <i class=\"fa-solid fa-arrow-right\"><\/i>\n                            <\/button>\n                            <button title=\"Remove\" class=\"btn-delete p-1.5 bg-rose-600 hover:bg-rose-700 text-white rounded-lg text-xs shadow-sm\">\n                                <i class=\"fa-solid fa-trash-can\"><\/i>\n                            <\/button>\n                        <\/div>\n                    <\/div>\n                    <div class=\"p-2.5 text-xs flex-grow flex flex-col justify-between bg-white\">\n                        <p class=\"font-medium text-slate-800 truncate\" title=\"${item.name}\">${item.name}<\/p>\n                        <div class=\"flex items-center justify-between text-[11px] text-slate-400 mt-1\">\n                            <span>${item.width} &times; ${item.height}<\/span>\n                            <span>${item.sizeFormatted}<\/span>\n                        <\/div>\n                    <\/div>\n                `;\n\n                \/\/ Button Listeners\n                const btnLeft = card.querySelector('.btn-move-left');\n                const btnRight = card.querySelector('.btn-move-right');\n                const btnDelete = card.querySelector('.btn-delete');\n\n                btnLeft.addEventListener('click', (e) => {\n                    e.stopPropagation();\n                    if (index > 0) moveItem(index, index - 1);\n                });\n\n                btnRight.addEventListener('click', (e) => {\n                    e.stopPropagation();\n                    if (index < uploadedImages.length - 1) moveItem(index, index + 1);\n                });\n\n                btnDelete.addEventListener('click', (e) => {\n                    e.stopPropagation();\n                    deleteItem(index);\n                });\n\n                \/\/ HTML5 Drag & Drop for reordering\n                card.addEventListener('dragstart', (e) => {\n                    draggedIndex = index;\n                    card.classList.add('drag-card-active');\n                    e.dataTransfer.effectAllowed = 'move';\n                });\n\n                card.addEventListener('dragend', () => {\n                    card.classList.remove('drag-card-active');\n                    document.querySelectorAll('#imagesGrid > div').forEach(c => c.classList.remove('drop-target'));\n                });\n\n                card.addEventListener('dragover', (e) => {\n                    e.preventDefault();\n                    card.classList.add('drop-target');\n                });\n\n                card.addEventListener('dragleave', () => {\n                    card.classList.remove('drop-target');\n                });\n\n                card.addEventListener('drop', (e) => {\n                    e.preventDefault();\n                    card.classList.remove('drop-target');\n                    if (draggedIndex !== null && draggedIndex !== index) {\n                        moveItem(draggedIndex, index);\n                    }\n                });\n\n                imagesGrid.appendChild(card);\n            });\n        }\n\n        function moveItem(fromIdx, toIdx) {\n            const item = uploadedImages.splice(fromIdx, 1)[0];\n            uploadedImages.splice(toIdx, 0, item);\n            renderImages();\n        }\n\n        function deleteItem(idx) {\n            URL.revokeObjectURL(uploadedImages[idx].url);\n            uploadedImages.splice(idx, 1);\n            renderImages();\n        }\n\n        \/\/ Helper: convert image URL to compressed Data URL using canvas\n        function compressImage(imgElement, quality) {\n            const canvas = document.createElement('canvas');\n            canvas.width = imgElement.naturalWidth;\n            canvas.height = imgElement.naturalHeight;\n            const ctx = canvas.getContext('2d');\n            ctx.drawImage(imgElement, 0, 0);\n            return canvas.toDataURL('image\/jpeg', quality);\n        }\n\n        \/\/ Generate PDF\n        generatePdfBtn.addEventListener('click', async () => {\n            if (uploadedImages.length === 0) return;\n\n            const { jsPDF } = window.jspdf;\n            if (!jsPDF) {\n                alertBox('jsPDF library failed to load. Please verify your connection.');\n                return;\n            }\n\n            \/\/ UI update\n            generatePdfBtn.disabled = true;\n            generatePdfBtn.classList.add('opacity-70', 'cursor-not-allowed');\n            progressContainer.classList.remove('hidden');\n\n            const quality = parseFloat(imgQualityInput.value) \/ 100;\n            const pageSizeSetting = pageSizeSelect.value;\n            const margin = parseFloat(pageMarginSelect.value);\n\n            let doc = null;\n\n            try {\n                for (let i = 0; i < uploadedImages.length; i++) {\n                    const imgObj = uploadedImages[i];\n                    \n                    \/\/ Update progress\n                    const percent = Math.round(((i + 1) \/ uploadedImages.length) * 100);\n                    progressBar.style.width = `${percent}%`;\n                    progressPercent.textContent = `${percent}%`;\n                    progressText.textContent = `Processing page ${i + 1} of ${uploadedImages.length}...`;\n\n                    \/\/ Load Image object\n                    const img = await new Promise((resolve, reject) => {\n                        const image = new Image();\n                        image.crossOrigin = 'anonymous';\n                        image.onload = () => resolve(image);\n                        image.onerror = reject;\n                        image.src = imgObj.url;\n                    });\n\n                    const imgWidth = img.naturalWidth;\n                    const imgHeight = img.naturalHeight;\n                    const isLandscapeImg = imgWidth > imgHeight;\n\n                    \/\/ Determine Orientation\n                    let orientation = 'portrait';\n                    if (currentOrientation === 'auto') {\n                        orientation = isLandscapeImg ? 'landscape' : 'portrait';\n                    } else {\n                        orientation = currentOrientation;\n                    }\n\n                    \/\/ Determine Page Dimensions (in mm)\n                    let pageWidth, pageHeight;\n                    if (pageSizeSetting === 'fit') {\n                        \/\/ 1px approx 0.264583 mm\n                        pageWidth = imgWidth * 0.264583;\n                        pageHeight = imgHeight * 0.264583;\n                    } else if (pageSizeSetting === 'letter') {\n                        pageWidth = orientation === 'landscape' ? 279.4 : 215.9;\n                        pageHeight = orientation === 'landscape' ? 215.9 : 279.4;\n                    } else {\n                        \/\/ a4\n                        pageWidth = orientation === 'landscape' ? 297 : 210;\n                        pageHeight = orientation === 'landscape' ? 210 : 297;\n                    }\n\n                    \/\/ Init doc on first page or add new page\n                    if (i === 0) {\n                        doc = new jsPDF({\n                            orientation: orientation,\n                            unit: 'mm',\n                            format: pageSizeSetting === 'fit' ? [pageWidth, pageHeight] : pageSizeSetting\n                        });\n                    } else {\n                        doc.addPage(\n                            pageSizeSetting === 'fit' ? [pageWidth, pageHeight] : pageSizeSetting,\n                            orientation\n                        );\n                    }\n\n                    \/\/ Compress to JPEG for smooth sizing\n                    const compressedDataUrl = compressImage(img, quality);\n\n                    \/\/ Compute available printable area\n                    const effMargin = pageSizeSetting === 'fit' ? 0 : margin;\n                    const printableWidth = Math.max(pageWidth - effMargin * 2, 10);\n                    const printableHeight = Math.max(pageHeight - effMargin * 2, 10);\n\n                    \/\/ Fit image proportionally inside printable dimensions\n                    const imgRatio = imgWidth \/ imgHeight;\n                    const pageRatio = printableWidth \/ printableHeight;\n\n                    let finalWidth, finalHeight;\n                    if (imgRatio > pageRatio) {\n                        finalWidth = printableWidth;\n                        finalHeight = printableWidth \/ imgRatio;\n                    } else {\n                        finalHeight = printableHeight;\n                        finalWidth = printableHeight * imgRatio;\n                    }\n\n                    \/\/ Center within available bounds\n                    const x = effMargin + (printableWidth - finalWidth) \/ 2;\n                    const y = effMargin + (printableHeight - finalHeight) \/ 2;\n\n                    doc.addImage(compressedDataUrl, 'JPEG', x, y, finalWidth, finalHeight, undefined, 'FAST');\n                }\n\n                \/\/ Output as blob\n                const pdfBlob = doc.output('blob');\n                if (generatedBlobUrl) URL.revokeObjectURL(generatedBlobUrl);\n                generatedBlobUrl = URL.createObjectURL(pdfBlob);\n\n                \/\/ Setup filename\n                let baseName = pdfFilenameInput.value.trim() || 'srabons-converted';\n                baseName = baseName.replace(\/[^a-zA-Z0-9_\\-\\s]\/g, '');\n                const fullFilename = `${baseName}.pdf`;\n\n                \/\/ Configure preview modal\n                pdfPreviewFrame.src = generatedBlobUrl;\n                modalDownloadBtn.href = generatedBlobUrl;\n                modalDownloadBtn.download = fullFilename;\n                pdfFileSizeBadge.textContent = `Document Size: ${formatBytes(pdfBlob.size)} (${uploadedImages.length} page${uploadedImages.length > 1 ? 's' : ''})`;\n\n                previewModal.classList.remove('hidden');\n\n            } catch (err) {\n                console.error('PDF Generation failed:', err);\n                alertBox('An error occurred while compiling your PDF. Please try again with fewer or smaller images.');\n            } finally {\n                generatePdfBtn.disabled = false;\n                generatePdfBtn.classList.remove('opacity-70', 'cursor-not-allowed');\n                progressContainer.classList.add('hidden');\n                progressBar.style.width = '0%';\n            }\n        });\n\n        \/\/ Close Modal\n        function closeModal() {\n            previewModal.classList.add('hidden');\n            pdfPreviewFrame.src = '';\n        }\n\n        closeModalBtn.addEventListener('click', closeModal);\n        modalCloseActionBtn.addEventListener('click', closeModal);\n        previewModal.addEventListener('click', (e) => {\n            if (e.target === previewModal) closeModal();\n        });\n\n        \/\/ Safe message box replacement for alert()\n        function alertBox(message) {\n            const toast = document.createElement('div');\n            toast.className = 'fixed bottom-6 right-6 z-50 bg-slate-900 text-white text-sm px-4 py-3 rounded-xl shadow-xl border border-slate-700 flex items-center gap-3 transition-all transform translate-y-2 opacity-0';\n            toast.innerHTML = `<i class=\"fa-solid fa-triangle-exclamation text-amber-400\"><\/i> <span>${message}<\/span>`;\n            document.body.appendChild(toast);\n            \n            setTimeout(() => {\n                toast.classList.remove('translate-y-2', 'opacity-0');\n            }, 10);\n\n            setTimeout(() => {\n                toast.classList.add('opacity-0', 'translate-y-2');\n                setTimeout(() => toast.remove(), 300);\n            }, 4000);\n        }\n\n        \/\/ FAQ Toggle\n        function toggleFaq(btn) {\n            const content = btn.nextElementSibling;\n            const icon = btn.querySelector('i');\n            const isHidden = content.classList.contains('hidden');\n\n            \/\/ Close all\n            document.querySelectorAll('#faqAccordion > div > div').forEach(d => d.classList.add('hidden'));\n            document.querySelectorAll('#faqAccordion button i').forEach(i => i.classList.remove('rotate-180'));\n\n            if (isHidden) {\n                content.classList.remove('hidden');\n                icon.classList.add('rotate-180');\n            }\n        }\n    <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Srabons.de | Fast &#038; Secure Image to PDF Converter Srabons.de Fast &#038; Secure PDF Suite Converter How it works Security &#038; Privacy FAQ 100% Client-Side Safe Private Start Converting Lightning Fast &bull; Unlimited Files &bull; Zero Cloud Uploads Convert Images to PDF Instantly Turn your JPG, PNG, WEBP, or BMP photos into a crisp, high-resolution [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_kb_optimizer_status":1,"footnotes":""},"class_list":["post-1024","page","type-page","status-publish","hentry"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/srabons.de\/en\/wp-json\/wp\/v2\/pages\/1024","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/srabons.de\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/srabons.de\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/srabons.de\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/srabons.de\/en\/wp-json\/wp\/v2\/comments?post=1024"}],"version-history":[{"count":1,"href":"https:\/\/srabons.de\/en\/wp-json\/wp\/v2\/pages\/1024\/revisions"}],"predecessor-version":[{"id":1025,"href":"https:\/\/srabons.de\/en\/wp-json\/wp\/v2\/pages\/1024\/revisions\/1025"}],"wp:attachment":[{"href":"https:\/\/srabons.de\/en\/wp-json\/wp\/v2\/media?parent=1024"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}