- Scan ID:
- e38a8ead-32f2-4112-a615-c066d96849deFinished
- Submitted URL:
- https://pixalto.app/
- Report Finished:
Links · 1 found
The outgoing links identified from the page
| Link | Text |
|---|---|
| https://statcounter.com/ |
JavaScript Variables · 35 found
Global JavaScript variables loaded on the window object of a page, are variables declared outside of functions and accessible from anywhere in the code within the current scope
| Name | Type |
|---|---|
| onbeforetoggle | object |
| documentPictureInPicture | object |
| onscrollend | object |
| imageSlider | function |
| Swiper | function |
| $ | function |
| jQuery | function |
| jsdom | undefined |
| virtualWindow | undefined |
| fabric | object |
Console log messages · 0 found
Messages logged to the web console
HTML
The raw HTML body of the page
<html lang="en"><head><script>
function imageSlider(beforeImageUrl, afterImageUrl) {
return {
position: 50,
isDragging: false,
beforeImage: beforeImageUrl,
afterImage: afterImageUrl,
startX: 0,
startPosition: 0,
startDragging(e) {
this.isDragging = true;
this.startX = e.type.includes('touch') ? e.touches[0].clientX : e.clientX;
this.startPosition = this.position;
},
stopDragging() {
this.isDragging = false;
},
drag(e) {
if (!this.isDragging) return;
e.preventDefault();
const currentX = e.type.includes('touch') ? e.touches[0].clientX : e.clientX;
const dx = currentX - this.startX;
const sliderWidth = this.$el.offsetWidth;
const newPosition = this.startPosition + (dx / sliderWidth * 100);
this.position = Math.max(0, Math.min(newPosition, 100));
},
init() {
// Preload images
new Image().src = this.beforeImage;
new Image().src = this.afterImage;
}
}
}
</script>
<meta charset="utf-8">
<meta name="csrf-token" content="rh0zY6ISgnU7mNtieAtDRzIChx4mbO9IpDbfYqaY">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Eczar&family=Inter:wght@100;200;400&family=Open+Sans:wght@300&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css">
<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
<script src="https://code.jquery.com/jquery-3.7.1.slim.min.js"></script>
<title>pixalto</title>
<link rel="icon" type="image/x-icon" href="https://pixalto.app/build/assets/pixalto_logo-BWW9pbWm.png">
<!-- Livewire Styles --><style>[wire\:loading][wire\:loading], [wire\:loading\.delay][wire\:loading\.delay], [wire\:loading\.inline-block][wire\:loading\.inline-block], [wire\:loading\.inline][wire\:loading\.inline], [wire\:loading\.block][wire\:loading\.block], [wire\:loading\.flex][wire\:loading\.flex], [wire\:loading\.table][wire\:loading\.table], [wire\:loading\.grid][wire\:loading\.grid], [wire\:loading\.inline-flex][wire\:loading\.inline-flex] {display: none;}[wire\:loading\.delay\.none][wire\:loading\.delay\.none], [wire\:loading\.delay\.shortest][wire\:loading\.delay\.shortest], [wire\:loading\.delay\.shorter][wire\:loading\.delay\.shorter], [wire\:loading\.delay\.short][wire\:loading\.delay\.short], [wire\:loading\.delay\.default][wire\:loading\.delay\.default], [wire\:loading\.delay\.long][wire\:loading\.delay\.long], [wire\:loading\.delay\.longer][wire\:loading\.delay\.longer], [wire\:loading\.delay\.longest][wire\:loading\.delay\.longest] {display: none;}[wire\:offline][wire\:offline] {display: none;}[wire\:dirty]:not(textarea):not(input):not(select) {display: none;}:root {--livewire-progress-bar-color: #2299dd;}[x-cloak] {display: none !important;}</style>
<link rel="preload" as="style" href="https://pixalto.app/build/assets/app-DPXDFJTi.css"><link rel="stylesheet" href="https://pixalto.app/build/assets/app-DPXDFJTi.css" data-navigate-track="reload"><link rel="stylesheet" type="text/css" href="https://sandbox-cdn.paddle.com/paddle/v2/assets/css/paddle.css" media="all"><style>/* Make clicks pass-through */
#nprogress {
pointer-events: none;
}
#nprogress .bar {
background: var(--livewire-progress-bar-color, #29d);
position: fixed;
z-index: 1031;
top: 0;
left: 0;
width: 100%;
height: 2px;
}
/* Fancy blur effect */
#nprogress .peg {
display: block;
position: absolute;
right: 0px;
width: 100px;
height: 100%;
box-shadow: 0 0 10px var(--livewire-progress-bar-color, #29d), 0 0 5px var(--livewire-progress-bar-color, #29d);
opacity: 1.0;
-webkit-transform: rotate(3deg) translate(0px, -4px);
-ms-transform: rotate(3deg) translate(0px, -4px);
transform: rotate(3deg) translate(0px, -4px);
}
/* Remove these to get rid of the spinner */
#nprogress .spinner {
display: block;
position: fixed;
z-index: 1031;
top: 15px;
right: 15px;
}
#nprogress .spinner-icon {
width: 18px;
height: 18px;
box-sizing: border-box;
border: solid 2px transparent;
border-top-color: var(--livewire-progress-bar-color, #29d);
border-left-color: var(--livewire-progress-bar-color, #29d);
border-radius: 50%;
-webkit-animation: nprogress-spinner 400ms linear infinite;
animation: nprogress-spinner 400ms linear infinite;
}
.nprogress-custom-parent {
overflow: hidden;
position: relative;
}
.nprogress-custom-parent #nprogress .spinner,
.nprogress-custom-parent #nprogress .bar {
position: absolute;
}
@-webkit-keyframes nprogress-spinner {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@keyframes nprogress-spinner {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
</style></head>
<body>
<section class="bg-gray-900 shadow-md">
<div class="relative overflow-hidden">
<div x-data="{ open: false }" class="relative py-3">
<div class="max-w-screen-xl mx-auto px-4 sm:px-6">
<nav class="relative flex items-center justify-between sm:h-10 md:justify-center">
<div class="flex items-center flex-1 md:absolute md:inset-y-0 md:left-0">
<div class="mr-2 flex items-center md:hidden">
<button @click="open = true" type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out" id="main-menu" aria-label="Main menu" aria-haspopup="true" x-bind:aria-expanded="open" aria-expanded="false">
<svg class="size-6 fill-white" stroke="white" fill="white" viewBox="0 0 24 24">
<path :class="{'hidden': open, 'inline-flex': !open }" class="inline-flex" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16">
</path>
<path :class="{'hidden': !open, 'inline-flex': open }" class="hidden" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
</svg>
</button>
</div>
<div class="flex items-center justify-between w-full md:w-auto">
<a href="/" wire:navigate="" aria-label="Home" class="flex items-center gap-2 text-3xl tracking-tight text-black font-bold">
<svg width="91" height="33" viewBox="0 0 91 33" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10.8493 21.3088V13.0792C12.7341 13.0792 13.6765 12.3598 13.6765 10.9191C13.6765 9.60049 12.9551 8.9412 11.5163 8.9412C10.0601 8.9412 9.3329 9.84482 9.3329 11.654V22.8271C9.3329 27.9812 5.15413 32.16 0 32.16V12.6197C0 10.5972 0.203606 8.93732 0.608878 7.642C1.01415 6.34668 1.70835 5.14056 2.68953 4.0217C3.79288 2.78067 5.17158 1.79948 6.82758 1.08008C8.48357 0.360671 10.1919 0 11.9546 0C15.1424 0 17.8203 1.07232 19.9883 3.21891C22.1562 5.36549 23.2421 8.024 23.2421 11.1964C23.2421 14.2776 22.2686 16.7752 20.3218 18.691C18.5436 20.4536 15.8618 21.334 12.2765 21.334L10.8493 21.3088Z" fill="white"></path>
<mask id="mask0_836_38" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="33">
<path d="M10.8493 21.3088V13.0792C12.7341 13.0792 13.6765 12.3598 13.6765 10.9191C13.6765 9.60049 12.9551 8.9412 11.5163 8.9412C10.0601 8.9412 9.3329 9.84482 9.3329 11.654V22.8271C9.3329 27.9812 5.15413 32.16 0 32.16V12.6197C0 10.5972 0.203606 8.93732 0.608878 7.642C1.01415 6.34668 1.70835 5.14056 2.68953 4.0217C3.79288 2.78067 5.17158 1.79948 6.82758 1.08008C8.48357 0.360671 10.1919 0 11.9546 0C15.1424 0 17.8203 1.07232 19.9883 3.21891C22.1562 5.36549 23.2421 8.024 23.2421 11.1964C23.2421 14.2776 22.2686 16.7752 20.3218 18.691C18.5436 20.4536 15.8618 21.334 12.2765 21.334L10.8493 21.3088Z" fill="white"></path>
</mask>
<g mask="url(#mask0_836_38)">
<path d="M7.93885 30.3799L4.89252 27.3995L9.1469 26.2089L7.93885 30.3799Z" fill="#29CC9B"></path>
<path d="M8.99749 26.3117L5.90268 23.2848L10.0078 22.1368L8.99749 26.3117Z" fill="white"></path>
<path d="M5.91812 23.2809L4.85938 27.4092L8.96445 26.2613L5.91812 23.2809Z" fill="#1366EF"></path>
</g>
<mask id="mask1_836_38" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="33">
<path d="M10.8493 21.3088V13.0792C12.7341 13.0792 13.6765 12.3598 13.6765 10.9191C13.6765 9.60049 12.9551 8.9412 11.5163 8.9412C10.0601 8.9412 9.3329 9.84482 9.3329 11.654V22.8271C9.3329 27.9812 5.15413 32.16 0 32.16V12.6197C0 10.5972 0.203606 8.93732 0.608878 7.642C1.01415 6.34668 1.70835 5.14056 2.68953 4.0217C3.79288 2.78067 5.17158 1.79948 6.82758 1.08008C8.48357 0.360671 10.1919 0 11.9546 0C15.1424 0 17.8203 1.07232 19.9883 3.21891C22.1562 5.36549 23.2421 8.024 23.2421 11.1964C23.2421 14.2776 22.2686 16.7752 20.3218 18.691C18.5436 20.4536 15.8618 21.334 12.2765 21.334L10.8493 21.3088Z" fill="white"></path>
</mask>
<g mask="url(#mask1_836_38)">
<path d="M3.84906 31.5239L0.802734 28.5435L4.90587 27.3956L3.84906 31.5239Z" fill="#29CC9B"></path>
<path d="M4.85929 27.4092L1.81296 24.4288L5.9161 23.2809L4.85929 27.4092Z" fill="white"></path>
<path d="M1.82659 24.4249L0.769775 28.5532L4.87291 27.4053L1.82659 24.4249Z" fill="#1467EF"></path>
<path d="M4.89236 27.3995L3.84912 31.524L8.00849 30.3605L4.89236 27.3995Z" fill="white"></path>
</g>
<mask id="mask2_836_38" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="33">
<path d="M10.8493 21.3088V13.0792C12.7341 13.0792 13.6765 12.3598 13.6765 10.9191C13.6765 9.60049 12.9551 8.9412 11.5163 8.9412C10.0601 8.9412 9.3329 9.84482 9.3329 11.654V22.8271C9.3329 27.9812 5.15413 32.16 0 32.16V12.6197C0 10.5972 0.203606 8.93732 0.608878 7.642C1.01415 6.34668 1.70835 5.14056 2.68953 4.0217C3.79288 2.78067 5.17158 1.79948 6.82758 1.08008C8.48357 0.360671 10.1919 0 11.9546 0C15.1424 0 17.8203 1.07232 19.9883 3.21891C22.1562 5.36549 23.2421 8.024 23.2421 11.1964C23.2421 14.2776 22.2686 16.7752 20.3218 18.691C18.5436 20.4536 15.8618 21.334 12.2765 21.334L10.8493 21.3088Z" fill="white"></path>
</mask>
<g mask="url(#mask2_836_38)">
<path d="M-0.24249 32.67L-3.28882 29.6896L0.816259 28.5397L-0.24249 32.67Z" fill="#29CC9B"></path>
<path d="M0.768008 28.5532L-2.27832 25.5728L1.82676 24.4249L0.768008 28.5532Z" fill="#29CC9B"></path>
<path d="M-2.26491 25.569L-3.32172 29.6974L0.783361 28.5494L-2.26491 25.569Z" fill="white"></path>
<path d="M0.802805 28.5436L-0.242371 32.67L3.917 31.5046L0.802805 28.5436Z" fill="#1467EF"></path>
</g>
<path d="M28.8518 18.9664V31.8866H24.0041V18.9664H28.8518ZM26.4415 13.1995C27.0989 13.1995 27.6671 13.4302 28.146 13.8937C28.625 14.3552 28.8654 14.902 28.8654 15.5322C28.8654 16.2051 28.6385 16.7597 28.1848 17.1902C27.731 17.6226 27.1493 17.8378 26.4415 17.8378C25.7338 17.8378 25.152 17.6226 24.6983 17.1902C24.2445 16.7577 24.0177 16.2051 24.0177 15.5322C24.0177 14.902 24.2581 14.3552 24.7371 13.8937C25.216 13.4322 25.7842 13.1995 26.4415 13.1995Z" fill="white"></path>
<path d="M38.2216 18.9664H43.0693V21.8052C43.0693 22.6177 42.9511 23.2712 42.7125 23.7676C42.474 24.264 42.0668 24.7022 41.487 25.0823C42.0746 25.4798 42.4857 25.9161 42.7184 26.3912C42.9511 26.8663 43.0693 27.4887 43.0693 28.2566V31.8847H38.2216V27.9832C38.2216 27.0931 37.9113 26.6491 37.2889 26.6491C36.6839 26.6491 36.3814 27.033 36.3814 27.8029V31.8847H31.5336V28.4369C31.5336 27.6419 31.6791 26.9942 31.968 26.494C32.2569 25.9937 32.7611 25.5225 33.4786 25.0823C32.7611 24.615 32.2589 24.1224 31.968 23.6047C31.6791 23.087 31.5336 22.4257 31.5336 21.6229V18.9664H36.3814V22.2318C36.3814 22.5692 36.4686 22.8446 36.6412 23.0618C36.8138 23.277 37.0349 23.3856 37.3025 23.3856C37.9152 23.3856 38.2216 23.0016 38.2216 22.2318V18.9664Z" fill="white"></path>
<path d="M52.8909 27.0408V32.0553C52.4934 32.1251 52.1308 32.1581 51.8031 32.1581C49.8601 32.1581 48.239 31.5182 46.9437 30.2403C45.6484 28.9624 45.0007 27.3588 45.0007 25.4313C45.0007 23.5562 45.6561 21.9661 46.9631 20.6631C48.272 19.3581 49.864 18.7065 51.7391 18.7065C53.8294 18.7065 55.4777 19.3173 56.6838 20.5409C57.888 21.7645 58.491 23.434 58.491 25.5496V31.8866H53.6433V25.8986C53.6433 25.2161 53.4765 24.6712 53.1449 24.2659C52.8114 23.8606 52.3654 23.657 51.8031 23.657C51.2931 23.657 50.8529 23.8432 50.4806 24.2136C50.1083 24.5859 49.9241 25.026 49.9241 25.536C49.9241 26.0712 50.0928 26.5133 50.4302 26.8585C50.7676 27.2037 51.1942 27.3762 51.7139 27.3762C52.1366 27.3782 52.5283 27.2657 52.8909 27.0408Z" fill="white"></path>
<path d="M66.1621 14.1981V31.8885H61.3143V14.1981H66.1621Z" fill="white"></path>
<path d="M73.3155 14.1981V19.1486H75.4931V24.2678H73.3155C73.3155 25.2956 73.4784 26.0033 73.8022 26.3931C74.126 26.7829 74.7194 26.9768 75.5842 26.9768V32.0708C75.3341 32.0785 75.1479 32.0844 75.0277 32.0844C73.9302 32.0844 72.8966 31.8303 71.9232 31.3204C70.9517 30.8104 70.1722 30.1201 69.5846 29.2475C68.842 28.1325 68.4697 26.6549 68.4697 24.8147V14.1981H73.3155Z" fill="white"></path>
<path d="M84.0077 18.695C85.8382 18.695 87.4089 19.3543 88.7178 20.6709C90.0267 21.9876 90.6802 23.5679 90.6802 25.4081C90.6802 27.2736 90.017 28.8636 88.6907 30.1783C87.3643 31.4911 85.7646 32.1485 83.8894 32.1485C82.0143 32.1485 80.4126 31.4892 79.0805 30.1725C77.7503 28.8559 77.0851 27.2677 77.0851 25.4101C77.0851 23.5175 77.7503 21.9255 79.0805 20.6341C80.4126 19.3407 82.0551 18.695 84.0077 18.695ZM83.8778 23.4768C83.3601 23.4768 82.918 23.6649 82.5553 24.0411C82.1927 24.4173 82.0105 24.8768 82.0105 25.4217C82.0105 25.9569 82.1947 26.4145 82.5612 26.7946C82.9277 27.1747 83.3659 27.3647 83.8759 27.3647C84.3936 27.3647 84.8377 27.1747 85.2042 26.7946C85.5707 26.4145 85.7549 25.9569 85.7549 25.4217C85.7549 24.8768 85.5726 24.4173 85.21 24.0411C84.8493 23.6649 84.4053 23.4768 83.8778 23.4768Z" fill="white"></path>
</svg>
</a>
</div>
</div>
<div class="fixed inset-0 h-screen bg-black bg-opacity-50 z-40" x-show="open" @click="open = false" x-transition:enter="transition ease-out duration-300" x-transition:leave="transition ease-in duration-300" style="display: none;"></div>
<div x-show="open" @click.outside="open = false" x-transition:enter="transition ease-out duration-300" x-transition:enter-start="opacity-0 transform -translate-x-full" x-transition:enter-end="opacity-100 transform translate-x-0" x-transition:leave="transition ease-in duration-300" x-transition:leave-start="opacity-100 transform translate-x-0" x-transition:leave-end="opacity-0 transform -translate-x-full" class="fixed h-screen inset-y-0 left-0 z-50 w-64 pt-4 px-6 bg-white shadow-xl overflow-y-auto md:hidden" style="display: none;">
<div class="mb-4 text-right">
<div class="flex items-center justify-between w-full md:w-auto">
<div class="flex items-center justify-between w-full md:w-auto">
<h1 class="text-3xl font-bold text-blue-500">Pixalto</h1>
</div>
<button @click="open = false" type="button" class=" ml-4 text-gray-500 hover:text-gray-900 focus:outline-none focus:text-gray-900">
<svg class="h-6 w-6" stroke="currentColor" fill="none" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
</svg>
</button>
</div>
</div>
<div class="divide-y-[3px] gap-4">
<div class="flex flex-col pt-4 items-start gap-4 ml-6 text-left justify-start ">
<a href="" class="block flex inline font-medium text-gray-500 hover:text-gray-900 transition duration-150 ease-in-out">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="mr-3">
<path fill-rule="evenodd" clip-rule="evenodd" d="M2 11H3V6C3 4.34314 4.34326 3 6 3H18C19.6567 3 21 4.34314 21 6V11H22C22.5522 11 23 11.4477 23 12C23 12.5523 22.5522 13 22 13H21V18C21 19.6569 19.6567 21 18 21H6C4.34326 21 3 19.6569 3 18V13H2C1.44775 13 1 12.5523 1 12C1 11.4477 1.44775 11 2 11ZM18 5H6C5.44775 5 5 5.44769 5 6V11H19V6C19 5.44769 18.5522 5 18 5ZM16.2929 13H13.7071L7.70711 19H10.2929L16.2929 13ZM11.7071 19L17.7071 13H19V14.2929L14.2929 19H11.7071ZM15.7071 19H18C18.5522 19 19 18.5523 19 18V15.7071L15.7071 19ZM6.29289 19L12.2929 13H9.70711L5 17.7071V18C5 18.5523 5.44775 19 6 19H6.29289ZM5 16.2929L8.29289 13H5V16.2929Z" fill="black"></path>
</svg>
Remove
bg
</a>
<a href="" class="block flex inline font-medium text-gray-500 hover:text-gray-900 transition duration-150 ease-in-out">
<svg width="24" height="24" class="mr-3" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.52513 20.9749C8.20901 21.6588 9.10549 22.0005 10.0018 22H21C21.2761 22 21.5 21.7761 21.5 21.5C21.5 21.2239 21.2761 21 21 21H12.4495L12.4749 20.9749L20.9749 12.4749C22.3417 11.108 22.3417 8.89196 20.9749 7.52513L16.4749 3.02513C15.108 1.65829 12.892 1.65829 11.5251 3.02513L3.02513 11.5251C1.65829 12.892 1.65829 15.108 3.02513 16.4749L7.52513 20.9749ZM8.93934 19.5607C9.52513 20.1464 10.4749 20.1464 11.0607 19.5607L13.4571 17.1642L6.83579 10.5429L4.43934 12.9393C3.85355 13.5251 3.85355 14.4749 4.43934 15.0607L8.93934 19.5607ZM7.54289 9.83579L12.9393 4.43934C13.5251 3.85355 14.4749 3.85355 15.0607 4.43934L19.5607 8.93934C20.1464 9.52513 20.1464 10.4749 19.5607 11.0607L14.1642 16.4571L7.54289 9.83579Z" fill="black"></path>
<path d="M4.80452 3.22038C4.70782 2.92654 4.29218 2.92654 4.19548 3.22038L3.7574 4.55278C3.72535 4.64948 3.64948 4.72534 3.55278 4.7574L2.22038 5.19548C1.92654 5.29218 1.92654 5.70782 2.22038 5.80452L3.55278 6.2426C3.64948 6.27466 3.72535 6.35052 3.7574 6.44722L4.19548 7.77962C4.29218 8.07346 4.70782 8.07346 4.80452 7.77962L5.2426 6.44722C5.27466 6.35052 5.35052 6.27466 5.44722 6.2426L6.77962 5.80452C7.07346 5.70782 7.07346 5.29218 6.77962 5.19548L5.44722 4.7574C5.35052 4.72534 5.27466 4.64948 5.2426 4.55278L4.80452 3.22038Z" fill="black"></path>
<path d="M18.7564 16.1763C18.8337 15.9412 19.1663 15.9412 19.2436 16.1763L19.5941 17.2422C19.6197 17.3196 19.6804 17.3803 19.7578 17.4059L20.8237 17.7564C21.0588 17.8337 21.0588 18.1663 20.8237 18.2436L19.7578 18.5941C19.6804 18.6197 19.6197 18.6804 19.5941 18.7578L19.2436 19.8237C19.1663 20.0588 18.8337 20.0588 18.7564 19.8237L18.4059 18.7578C18.3803 18.6804 18.3196 18.6197 18.2422 18.5941L17.1763 18.2436C16.9412 18.1663 16.9412 17.8337 17.1763 17.7564L18.2422 17.4059C18.3196 17.3803 18.3803 17.3196 18.4059 17.2422L18.7564 16.1763Z" fill="black"></path>
<path d="M3.68271 19.1322C3.62469 18.9559 3.37531 18.9559 3.31729 19.1322L3.05444 19.9317C3.03521 19.9897 2.98969 20.0352 2.93167 20.0544L2.13223 20.3173C1.95592 20.3753 1.95592 20.6247 2.13223 20.6827L2.93167 20.9456C2.98969 20.9648 3.03521 21.0103 3.05444 21.0683L3.31729 21.8678C3.37531 22.0441 3.62469 22.0441 3.68271 21.8678L3.94556 21.0683C3.96479 21.0103 4.01031 20.9648 4.06833 20.9456L4.86777 20.6827C5.04408 20.6247 5.04408 20.3753 4.86777 20.3173L4.06833 20.0544C4.01031 20.0352 3.96479 19.9897 3.94556 19.9317L3.68271 19.1322Z" fill="black"></path>
</svg>
Remove
object
</a>
<a href="" class="block flex inline font-medium text-gray-500 hover:text-gray-900 transition duration-150 ease-in-out">
<svg class="mr-3" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M2 6C2 3.79086 3.79086 2 6 2H18C20.2091 2 22 3.79086 22 6V18C22 20.2091 20.2091 22 18 22H6C3.79086 22 2 20.2091 2 18V6ZM6 4C4.89543 4 4 4.89543 4 6V18C4 19.1046 4.89543 20 6 20H18C19.1046 20 20 19.1046 20 18V6C20 4.89543 19.1046 4 18 4H6ZM16.9159 5.99996C16.9444 5.99998 16.9725 6 17 6C17.5523 6 18 6.44771 18 7C18 7.55228 17.5523 8 17 8C15.9439 8 14.9963 8.02531 14.28 8.473C13.6768 8.84998 13 9.70039 13 12C13 14.7004 12.1768 16.35 10.78 17.223C9.53372 18.0019 8.03417 18.0008 7.08408 18C7.05555 18 7.02752 18 7 18C6.44772 18 6 17.5523 6 17C6 16.4477 6.44772 16 7 16C8.05611 16 9.00371 15.9747 9.72 15.527C10.3232 15.15 11 14.2996 11 12C11 9.29961 11.8232 7.65002 13.22 6.777C14.4663 5.99808 15.9658 5.99923 16.9159 5.99996Z" fill="black"></path>
</svg>
Enhancer
</a>
<a href="" class="block flex inline font-medium text-gray-500 hover:text-gray-900 transition duration-150 ease-in-out">
<svg data-slot="icon" class="w-6 h-6 mr-3" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M22 8.84211C22 11.6883 20.2621 14.1287 17.7895 15.1598V15.1579C17.7895 10.2164 13.7836 6.21053 8.84211 6.21053H8.84017C9.87129 3.73795 12.3117 2 15.1579 2C18.9367 2 22 5.06332 22 8.84211ZM6.73683 2.52632C4.41142 2.52632 2.52631 4.41143 2.52631 6.73684V8.31579H4.63157V6.73684C4.63157 5.57414 5.57413 4.63158 6.73683 4.63158H8.31578V2.52632H6.73683ZM19.3684 15.6842V17.2632C19.3684 18.4259 18.4259 19.3684 17.2631 19.3684H15.6842V21.4737H17.2631C19.5885 21.4737 21.4737 19.5885 21.4737 17.2632V15.6842H19.3684Z" fill="currentColor"></path>
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.75 22C12.4779 22 15.5 18.9779 15.5 15.25C15.5 11.5221 12.4779 8.5 8.75 8.5C5.02208 8.5 2 11.5221 2 15.25C2 18.9779 5.02208 22 8.75 22ZM6.80001 13.15C6.80001 12.791 6.50899 12.5 6.15 12.5C5.79102 12.5 5.5 12.791 5.5 13.15V14.0167C5.5 14.3757 5.79102 14.6667 6.15 14.6667C6.50899 14.6667 6.80001 14.3757 6.80001 14.0167V13.15ZM12 13.15C12 12.791 11.709 12.5 11.35 12.5C10.991 12.5 10.7 12.791 10.7 13.15V14.0167C10.7 14.3757 10.991 14.6667 11.35 14.6667C11.709 14.6667 12 14.3757 12 14.0167V13.15ZM7.30736 17.7688C6.98627 17.6083 6.59583 17.7384 6.43528 18.0595C6.27474 18.3806 6.40488 18.7711 6.72597 18.9316C7.41072 19.274 9.13976 19.7488 10.774 18.9316C11.0951 18.7711 11.2252 18.3806 11.0647 18.0595C10.9042 17.7384 10.5137 17.6083 10.1926 17.7688C9.05356 18.3384 7.77816 18.0042 7.30736 17.7688ZM8.74999 12.9338C9.10898 12.9338 9.4 13.2249 9.4 13.5838V16.1839C9.4 16.5429 9.10898 16.8339 8.74999 16.8339H8.31666C7.95767 16.8339 7.66666 16.5429 7.66666 16.1839C7.66666 15.9009 7.84753 15.6601 8.09999 15.5709V13.5838C8.09999 13.2249 8.39101 12.9338 8.74999 12.9338Z" fill="currentColor"></path>
</svg>
Face swap
</a>
<a href="" class="block flex inline font-medium text-gray-500 hover:text-gray-900 transition duration-150 ease-in-out">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="black" data-slot="icon" class="w-6 h-6 mr-3">
<path stroke-linecap="round" stroke-linejoin="round" d="M11.42 15.17 17.25 21A2.652 2.652 0 0 0 21 17.25l-5.877-5.877M11.42 15.17l2.496-3.03c.317-.384.74-.626 1.208-.766M11.42 15.17l-4.655 5.653a2.548 2.548 0 1 1-3.586-3.586l6.837-5.63m5.108-.233c.55-.164 1.163-.188 1.743-.14a4.5 4.5 0 0 0 4.486-6.336l-3.276 3.277a3.004 3.004 0 0 1-2.25-2.25l3.276-3.276a4.5 4.5 0 0 0-6.336 4.486c.091 1.076-.071 2.264-.904 2.95l-.102.085m-1.745 1.437L5.909 7.5H4.5L2.25 3.75l1.5-1.5L7.5 4.5v1.409l4.26 4.26m-1.745 1.437 1.745-1.437m6.615 8.206L15.75 15.75M4.867 19.125h.008v.008h-.008v-.008Z"></path>
</svg>
Restore
old photo
</a>
<a href="" class="block flex inline font-medium text-gray-500 hover:text-gray-900 transition duration-150 ease-in-out">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="black" class="w-6 h-6 mr-3">
<path stroke-linecap="round" stroke-linejoin="round" d="M8.25 7.5V6.108c0-1.135.845-2.098 1.976-2.192.373-.03.748-.057 1.123-.08M15.75 18H18a2.25 2.25 0 0 0 2.25-2.25V6.108c0-1.135-.845-2.098-1.976-2.192a48.424 48.424 0 0 0-1.123-.08M15.75 18.75v-1.875a3.375 3.375 0 0 0-3.375-3.375h-1.5a1.125 1.125 0 0 1-1.125-1.125v-1.5A3.375 3.375 0 0 0 6.375 7.5H5.25m11.9-3.664A2.251 2.251 0 0 0 15 2.25h-1.5a2.251 2.251 0 0 0-2.15 1.586m5.8 0c.065.21.1.433.1.664v.75h-6V4.5c0-.231.035-.454.1-.664M6.75 7.5H4.875c-.621 0-1.125.504-1.125 1.125v12c0 .621.504 1.125 1.125 1.125h9.75c.621 0 1.125-.504 1.125-1.125V16.5a9 9 0 0 0-9-9Z"></path>
</svg>
Blog
</a>
</div>
</div>
</div>
<div class=" ml-2 md:absolute md:flex md:items-center md:justify-end md:inset-y-0 md:right-0">
<span class="inline-flex rounded-md">
<a href="https://pixalto.app/login" class="block px-4 py-2 mt-2 font-medium text-white hover:text-slate-200 hover:no-underline">
Log in
</a>
<div class="inline-flex rounded">
<a href="https://pixalto.app/register" class="px-6 py-3 font-semibold text-black bg-white rounded-full hover:no-underline">
SignUp
</a>
</div>
</span>
</div>
</nav>
</div>
</div>
</div>
</section>
<div id="gradiant-bg" class="relative w-full">
<section id="hero" class="flex px-2 md: container mx-auto" data-aos="fade-down" data-aos-delay="300">
<div class="w-full mx-auto 2xl:max-w-7xl my-10 py-10 md:py-24 flex flex-col gap-10" style="background-image: url(https://pixalto.app/build/assets/bg-icons-hero-CMQ4keax.svg);background-repeat:no-repeat;background-size:100%;background-position:center center;">
<div class="flex flex-col gap-4 text-center max-w-[1000px] mx-auto">
<span class="font-bold text-[24px] md:text-[35px]">
In the Perfect Blend of Your Photos and AI,
</span>
<h1 class="font-bold text-[40px] md:text-[72px] text-[#004FED] pb-5 leading-[40px] md:leading-[72px]">
Pixalto is where they meet.
</h1>
<p class="text-[19px] max-w-[800px] mx-auto">
Pixalto is your AI-powered companion for photo enhancement. It revitalizes your images, adding
clarity and vibrancy. With Pixalto, every pixel of your photo gets a touch of AI magic,
transforming memories into masterpieces. Experience the future of photo enhancement with
Pixalto.
</p>
</div>
</div>
</section>
<section id="preview" class="mb-20 md:mb-20 flex px-2 md:px-10 lg:px-16 container mx-auto" data-aos="fade-down" data-aos-delay="600">
<div class="w-full mx-auto 2xl:max-w-7xl">
<div x-data="{ activeTab: 'Deblureffect' }" class="border-green-400 border-2 rounded-3xl p-4 flex flex-col-reverse lg:flex-row gap-10 items-center">
<div class="min-w-[180px] flex flew-row lg:flex-col gap-4 md:ml-10 my-auto">
<button @click="activeTab = 'Deblureffect'" class="w-full min-w-[80px] border-4 border-[#004FED] rounded-3xl overflow-hidden flex flex-col items-center p-2 xl:p-6 gap-4 text-sm bg-[#004FED] text-white" :class="{
'bg-[#004FED] text-white' : activeTab === 'Deblureffect',
'text-[#004FED] bg-white': activeTab !== 'Deblureffect'
}">
<svg :style="{ fill: activeTab === 'Deblureffect' ? '#ffff' : '#004FED' }" class="max-w-[40px] md:max-w-full" width="71" height="70" viewBox="0 0 71 70" xmlns="http://www.w3.org/2000/svg" style="fill: rgb(255, 255, 255);">
<path d="M55.2861 19.5336C48.8148 22.2151 46.6418 24.3881 43.9614 30.8582C41.2799 24.3869 39.1069 22.214 32.6365 19.5336C39.1079 16.8521 41.2808 14.6791 43.9614 8.20868C45.3022 11.4451 46.5149 13.6055 48.2022 15.2926C49.8895 16.9797 52.0504 18.1928 55.2861 19.5336Z"></path>
<path d="M62.2418 6.95581C58.2671 8.60219 56.9323 9.93786 55.2859 13.9116C53.6396 9.93692 52.3039 8.60219 48.3301 6.95581C52.3048 5.30942 53.6396 3.97375 55.2859 0C56.0011 1.72659 56.6574 2.95501 57.4968 3.92707C58.59 5.19295 59.9936 6.02445 62.2418 6.95581Z"></path>
<path d="M70.2616 23.9025C66.2869 25.5489 64.9522 26.8845 63.3058 30.8583C61.6594 26.8836 60.3237 25.5489 56.35 23.9025C60.3247 22.2561 61.6594 20.9204 63.3058 16.9467C64.129 18.9348 64.8743 20.2614 65.9106 21.2977C66.9469 22.334 68.2736 23.0793 70.2616 23.9025Z"></path>
<path fill-rule="evenodd" clip-rule="evenodd" d="M51.2998 58.3239C54.8264 53.4769 56.7269 47.6372 56.7284 41.643C56.7351 35.219 54.5505 28.9849 50.5354 23.9702C48.4618 25.6116 47.2043 27.7105 45.7087 31.3214L43.961 35.5379L42.2134 31.3214C39.7329 25.3295 37.9044 23.501 31.9126 21.0206L27.6961 19.273L31.9126 17.5253C34.2058 16.5775 35.8887 15.7222 37.2318 14.6935C31.538 12.8195 25.3969 12.7975 19.6898 14.6307C13.9828 16.4638 9.00323 20.0579 5.4658 24.8971C1.92833 29.7362 0.0148962 35.5717 8.66189e-05 41.5658C-0.0147229 47.5601 1.86985 53.4049 5.38336 58.2614C8.89682 63.1181 13.8586 66.7366 19.5565 68.598C25.2545 70.4593 31.3956 70.4677 37.0985 68.6218C42.8015 66.776 47.773 63.1709 51.2998 58.3239ZM17.5653 41.3763C19.5056 41.3763 21.0784 39.8034 21.0784 37.8632C21.0784 35.923 19.5056 34.3501 17.5653 34.3501C15.6251 34.3501 14.0523 35.923 14.0523 37.8632C14.0523 39.8034 15.6251 41.3763 17.5653 41.3763ZM42.1568 37.8632C42.1568 39.8034 40.584 41.3763 38.6437 41.3763C36.7035 41.3763 35.1307 39.8034 35.1307 37.8632C35.1307 35.923 36.7035 34.3501 38.6437 34.3501C40.584 34.3501 42.1568 35.923 42.1568 37.8632ZM34.729 57.3688C36.4858 55.6119 37.4729 53.2291 37.4729 50.7445H28.1047H18.7365C18.7365 53.2291 19.7235 55.6119 21.4803 57.3688C23.2372 59.1257 25.6201 60.1127 28.1047 60.1127C30.5893 60.1127 32.9721 59.1257 34.729 57.3688Z"></path>
</svg>
<span class="text-center">De-blur effect</span>
</button>
<button @click="activeTab = 'ColoringImage'" class="w-full min-w-[80px] border-4 border-[#004FED] rounded-3xl overflow-hidden block flex flex-col items-center p-2 xl:p-6 gap-4 text-sm text-[#004FED] bg-white" :class="{
'bg-[#004FED] text-white' : activeTab === 'ColoringImage',
'text-[#004FED] bg-white': activeTab !== 'ColoringImage'
}">
<svg :style="{ fill: activeTab === 'ColoringImage' ? '#ffff' : '#004FED' }" class="max-w-[40px] md:max-w-full" width="70" height="77" viewBox="0 0 70 77" xmlns="http://www.w3.org/2000/svg" style="fill: rgb(0, 79, 237);">
<path d="M11.6684 45.434C11.1131 45.4334 10.5888 45.6897 10.2482 46.1283C10.2482 46.1283 7.74942 49.342 5.24058 53.2645C3.98618 55.2258 2.72439 57.3686 1.75137 59.4294C0.77839 61.4902 0.0435611 63.4187 0.0435791 65.3207C0.0435611 71.7368 5.2665 76.9842 11.6684 76.9842C18.0704 76.9842 23.2898 71.7368 23.2898 65.3207C23.2898 63.4187 22.555 61.4902 21.582 59.4294C20.609 57.3686 19.3472 55.2258 18.0928 53.2645C15.584 49.342 13.0852 46.1283 13.0852 46.1283C12.7453 45.6907 12.2225 45.4345 11.6684 45.434Z"></path>
<path d="M38.6914 0.817627C37.6998 0.817627 36.896 1.62145 36.896 2.61308V11.1064C28.7851 15.7895 20.6733 20.471 12.5627 25.1545C11.7053 25.6507 11.4118 26.7476 11.9069 27.6057C12.402 28.4643 13.4991 28.7594 14.3581 28.2649L17.4686 26.4695L35.5038 57.7076C37.4315 61.0464 41.7524 62.2022 45.0913 60.2745L65.5847 48.4428C68.9235 46.5151 70.0863 42.1942 68.1586 38.8553L50.1199 7.61721L53.2304 5.82175C54.0912 5.32662 54.3866 4.2268 53.8897 3.36703C53.6511 2.9553 53.2588 2.65515 52.7991 2.53243C52.3387 2.40854 51.8479 2.47283 51.435 2.71127L40.4869 9.03394V2.61308C40.4869 1.62149 39.683 0.817627 38.6914 0.817627ZM47.0129 9.41266L65.0481 40.6508C66.0055 42.3089 65.4474 44.3749 63.7892 45.3323L43.2958 57.164C41.6376 58.1214 39.5716 57.5703 38.6143 55.9121L20.5791 24.674L36.896 15.2549V21.8301C35.8609 22.1684 34.8874 22.7445 34.0695 23.5624C31.2799 26.352 31.2799 30.9283 34.0695 33.7179C36.8592 36.5076 41.439 36.5076 44.2286 33.7179C47.0182 30.9283 47.0182 26.352 44.2286 23.5624C43.1727 22.5065 41.8612 21.8517 40.4869 21.5951V13.1789L47.0129 9.41266Z"></path>
</svg>
<span class="text-center">Coloring Image</span>
</button>
<button @click="activeTab = 'ImageRestoration'" class="w-full min-w-[80px] border-4 border-[#004FED] rounded-3xl overflow-hidden flex flex-col items-center p-2 xl:p-6 gap-4 text-sm text-[#004FED] bg-white" :class="{
'bg-[#004FED] text-white' : activeTab === 'ImageRestoration',
'text-[#004FED] bg-white': activeTab !== 'ImageRestoration'
}">
<svg :style="{ fill: activeTab === 'ImageRestoration' ? '#ffff' : '#004FED' }" class="max-w-[40px] md:max-w-full" width="67" height="70" viewBox="0 0 67 70" fill="none" xmlns="http://www.w3.org/2000/svg" style="fill: rgb(0, 79, 237);">
<path d="M26.406 42.0867L15.537 52.9147V59.8736H57.7812V57.747L51.0141 50.9813L42.7092 55.7177L26.406 42.0867Z"></path>
<path d="M43.4746 46.4373C46.464 46.4373 48.8874 44.0139 48.8874 41.0245C48.8874 38.0351 46.464 35.6117 43.4746 35.6117C40.4852 35.6117 38.0618 38.0351 38.0618 41.0245C38.0618 44.0139 40.4852 46.4373 43.4746 46.4373Z"></path>
<path d="M60.9168 25.4603H31.4757V25.5242C27.3799 25.5242 23.7764 27.6592 21.7114 30.8731H60.2944V63.8248H11.9601V35.0944C11.4214 32.0593 9.7011 29.4297 7.29067 27.6995C6.82197 28.4398 6.54654 29.3133 6.54654 30.2522V64.4487C6.54654 67.0912 8.696 69.2399 11.3377 69.2399H60.9168C63.5585 69.2399 65.708 67.0912 65.708 64.4487V30.2515C65.708 27.6097 63.5585 25.4603 60.9168 25.4603Z"></path>
<path d="M16.0087 36.4799C16.0087 27.9376 22.9342 21.0129 31.4757 21.0129C22.9334 21.0129 16.0087 14.0882 16.0087 5.54596C16.0087 14.0882 9.0833 21.0129 0.541779 21.0129C9.0833 21.0137 16.0087 27.9383 16.0087 36.4799Z"></path>
<path d="M34.3556 19.8518C34.3556 15.2059 38.1219 11.4404 42.7677 11.4404C38.1226 11.4404 34.3556 7.6741 34.3556 3.02899C34.3556 7.6741 30.59 11.4404 25.9442 11.4404C30.59 11.4404 34.3556 15.2059 34.3556 19.8518Z"></path>
<path d="M48.198 11.6208C48.198 8.6222 50.629 6.19046 53.6284 6.19046C50.6298 6.19046 48.198 3.75948 48.198 0.760132C48.198 3.75872 45.767 6.19046 42.7677 6.19046C45.7663 6.19122 48.198 8.6222 48.198 11.6208Z"></path>
</svg>
<span class="text-center">Image Restoration</span>
</button>
</div>
<div class="w-full">
<div class="container-slider">
<div x-show="activeTab === 'Deblureffect'" x-transition:enter="transition ease-out duration-900" x-transition:enter-start="opacity-9 duration-100 scale-90">
<div x-data="imageSlider('https://pixalto.app/build/assets/before-DqsvrRUJ.jpg','https://pixalto.app/build/assets/after-J_vGe4Tw.jpg')" class="relative w-full h-[600px] overflow-hidden select-none" @mousemove="drag($event)" @touchmove="drag($event)" @mouseup.window="stopDragging()" @mouseleave.window="stopDragging()" @touchend.window="stopDragging()" @touchcancel.window="stopDragging()">
<!-- After image (background) -->
<img :src="afterImage" alt="After" class="transition duration-700 ease-in-out absolute top-0 left-0 w-full h-full object-cover" src="https://pixalto.app/build/assets/after-J_vGe4Tw.jpg">
<!-- Before image (fixed, clipped) -->
<div class="absolute top-0 left-0 w-full h-full overflow-hidden" :style="{ clipPath: `inset(0 ${100 - position}% 0 0)` }" style="clip-path: inset(0px 50% 0px 0px);">
<img :src="beforeImage" alt="Before" class="absolute top-0 left-0 w-full h-full object-cover" src="https://pixalto.app/build/assets/before-DqsvrRUJ.jpg">
</div>
<!-- Slider handle -->
<div class="absolute top-0 bottom-0 w-1 bg-white cursor-ew-resize" @mousedown.prevent="startDragging($event)" @touchstart.prevent="startDragging($event)" :style="{ left: `calc(${position}% - 0.5px)` }" style="left: calc(50% - 0.5px);">
<div class="absolute top-1/2 left-1/2 w-10 h-10 -mt-5 -ml-5 bg-white rounded-full shadow-lg flex items-center justify-center">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M8.25 15L12 18.75 15.75 15m-7.5-6L12 5.25 15.75 9"></path>
</svg>
</div>
</div>
<!-- Labels -->
<div class="absolute bottom-4 left-4 bg-black bg-opacity-50 text-white px-2 py-1 rounded">Before</div>
<div class="absolute bottom-4 right-4 bg-black bg-opacity-50 text-white px-2 py-1 rounded">After</div>
</div>
</div>
<div x-show="activeTab === 'ColoringImage'" x-transition:enter="transition ease-out duration-900" x-transition:enter-start="opacity-9 duration-100 scale-90" style="display: none;">
<div x-data="imageSlider('https://pixalto.app/build/assets/girlface_black_white-5iJVde3E.png','https://pixalto.app/build/assets/girlface_color-xiUk6lnN.png')" class="relative w-full h-[600px] overflow-hidden select-none" @mousemove="drag($event)" @touchmove="drag($event)" @mouseup.window="stopDragging()" @mouseleave.window="stopDragging()" @touchend.window="stopDragging()" @touchcancel.window="stopDragging()">
<!-- After image (background) -->
<img :src="afterImage" alt="After" class="absolute top-0 left-0 w-full h-full object-cover" src="https://pixalto.app/build/assets/girlface_color-xiUk6lnN.png">
<!-- Before image (fixed, clipped) -->
<div class="absolute top-0 left-0 w-full h-full overflow-hidden" :style="{ clipPath: `inset(0 ${100 - position}% 0 0)` }" style="clip-path: inset(0px 50% 0px 0px);">
<img :src="beforeImage" alt="Before" class="absolute top-0 left-0 w-full h-full object-cover" src="https://pixalto.app/build/assets/girlface_black_white-5iJVde3E.png">
</div>
<!-- Slider handle -->
<div class="absolute top-0 bottom-0 w-1 bg-white cursor-ew-resize" @mousedown.prevent="startDragging($event)" @touchstart.prevent="startDragging($event)" :style="{ left: `calc(${position}% - 0.5px)` }" style="left: calc(50% - 0.5px);">
<div class="absolute top-1/2 left-1/2 w-10 h-10 -mt-5 -ml-5 bg-white rounded-full shadow-lg flex items-center justify-center">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M8.25 15L12 18.75 15.75 15m-7.5-6L12 5.25 15.75 9"></path>
</svg>
</div>
</div>
<!-- Labels -->
<div class="absolute bottom-4 left-4 bg-black bg-opacity-50 text-white px-2 py-1 rounded">Before</div>
<div class="absolute bottom-4 right-4 bg-black bg-opacity-50 text-white px-2 py-1 rounded">After</div>
</div>
</div>
<div x-show="activeTab === 'ImageRestoration'" x-transition:enter="transition ease-out duration-900" x-transition:enter-start="opacity-9 duration-100 scale-90" style="display: none;">
<div x-data="imageSlider('https://images.pexels.com/photos/19988733/pexels-photo-19988733/free-photo-of-hills-in-a-mountain-valley.png?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1','https://images.pexels.com/photos/21274019/pexels-photo-21274019/free-photo-of-rocky-hills-in-a-mountain-valley.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1')" class="relative w-full h-[600px] overflow-hidden select-none" @mousemove="drag($event)" @touchmove="drag($event)" @mouseup.window="stopDragging()" @mouseleave.window="stopDragging()" @touchend.window="stopDragging()" @touchcancel.window="stopDragging()">
<!-- After image (background) -->
<img :src="afterImage" alt="After" class="absolute top-0 left-0 w-full h-full object-cover" src="https://images.pexels.com/photos/21274019/pexels-photo-21274019/free-photo-of-rocky-hills-in-a-mountain-valley.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1">
<!-- Before image (fixed, clipped) -->
<div class="absolute top-0 left-0 w-full h-full overflow-hidden" :style="{ clipPath: `inset(0 ${100 - position}% 0 0)` }" style="clip-path: inset(0px 50% 0px 0px);">
<img :src="beforeImage" alt="Before" class="absolute top-0 left-0 w-full h-full object-cover" src="https://images.pexels.com/photos/19988733/pexels-photo-19988733/free-photo-of-hills-in-a-mountain-valley.png?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1">
</div>
<!-- Slider handle -->
<div class="absolute top-0 bottom-0 w-1 bg-white cursor-ew-resize" @mousedown.prevent="startDragging($event)" @touchstart.prevent="startDragging($event)" :style="{ left: `calc(${position}% - 0.5px)` }" style="left: calc(50% - 0.5px);">
<div class="absolute top-1/2 left-1/2 w-10 h-10 -mt-5 -ml-5 bg-white rounded-full shadow-lg flex items-center justify-center">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M8.25 15L12 18.75 15.75 15m-7.5-6L12 5.25 15.75 9"></path>
</svg>
</div>
</div>
<!-- Labels -->
<div class="absolute bottom-4 left-4 bg-black bg-opacity-50 text-white px-2 py-1 rounded">Before</div>
<div class="absolute bottom-4 right-4 bg-black bg-opacity-50 text-white px-2 py-1 rounded">After</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="benefits" class="mb-20 md:mb-32 flex px-2 md:px-10 lg:px-16 container mx-auto">
<div class="w-full mx-auto 2xl:max-w-7xl">
<div>
<h2 class="text-[#004FED] text-[35px] text-center font-bold pb-4">
Benefits
</h2>
<p class="text-[#202329] text-[24px] md:text-[45px] text-center font-bold mx-auto">
Unleashing AI Magic: Enhancing Quality, Saving Time, and Sparking Creativity.
</p>
</div>
<div class="grid grid-cols-1 lg:grid-cols-3 gap-4 mt-10">
<div class="col-span-1">
<div class="border-2 border-[#004FED] flex flex-col gap-4 p-4 md:p-10 rounded-3xl h-full">
<img src="https://pixalto.app/build/assets/bic1-CU0J7i2w.svg" class="w-[60px]" alt="">
<h3 class="font-bold text-[22px]">AI-Powered Enhancement</h3>
<p class="text-[18px]">
Pixalto uses advanced AI technology to enhance your photos, improving clarity and
vibrancy.
</p>
</div>
</div>
<div class="col-span-1">
<div class="border-2 border-[#004FED] flex flex-col gap-4 p-4 md:p-10 rounded-3xl h-full">
<img src="https://pixalto.app/build/assets/bic2-DUlGwpNp.svg" class="w-[60px]" alt="">
<h3 class="font-bold text-[22px]">Ease of Use</h3>
<p class="text-[18px]">
With its user-friendly interface, Pixalto is easy to use for both professionals and
casual users.
</p>
</div>
</div>
<div class="col-span-1">
<div class="border-2 border-[#004FED] flex flex-col gap-4 p-4 md:p-10 rounded-3xl h-full">
<img src="https://pixalto.app/build/assets/bic3-oGTEr7U3.svg" class="w-[60px]" alt="">
<h3 class="font-bold text-[22px]">Quality Improvement</h3>
<p class="text-[18px]">
Pixalto can transform even low-quality images into high-quality photos.
</p>
</div>
</div>
<div class="col-span-1">
<div class="border-2 border-[#004FED] flex flex-col gap-4 p-4 md:p-10 rounded-3xl h-full">
<img src="https://pixalto.app/build/assets/bic4-BVgcspOo.svg" class="w-[60px]" alt="">
<h3 class="font-bold text-[22px]">Creative Control</h3>
<p class="text-[18px]">
Pixalto offers a range of features, giving you the freedom to customize and control the
enhancement process.
</p>
</div>
</div>
<div class="col-span-1">
<div class="border-2 border-[#004FED] flex flex-col gap-4 p-4 md:p-10 rounded-3xl h-full">
<img src="https://pixalto.app/build/assets/bic5-BZMgP_Af.svg" class="w-[60px]" alt="">
<h3 class="font-bold text-[22px]">Time-Saving</h3>
<p class="text-[18px]">
Pixalto’s AI does the heavy lifting, saving you time on manual editing.
</p>
</div>
</div>
<div class="col-span-1">
<div class="border-2 border-[#004FED] flex flex-col gap-4 p-4 md:p-10 rounded-3xl h-full">
<img src="https://pixalto.app/build/assets/bic6-BpbuMdA9.svg" class="w-[60px]" alt="">
<h3 class="font-bold text-[22px]">Versatility</h3>
<p class="text-[18px]">
Whether it’s a landscape, a portrait, or a group photo, Pixalto is versatile and can
enhance all types of photos
</p>
</div>
</div>
</div>
</div>
</section>
<section id="phone-push" class="mt-[200px] mb-20 md:mb-32 flex px-2 md:px-10 lg:px-16 container mx-auto">
<div class="w-full mx-auto 2xl:max-w-7xl">
<div class="border-2 border-[#004FED] flex flex-col-reverse xl:flex-row rounded-3xl relative">
<div class="w-full max-w-[100%] xl:max-w-[60%] flex flex-col gap-8 p-8 md:p-14">
<h2 class="text-[32px] md:text-[60px] text-[#202329] font-bold leading-[36px] md:leading-[60px]">
Unlock the magic of Pixalto
</h2>
<p class="text-[18px] text-[#4F5561]">
Download Pixalto now and transform your ordinary pictures into stunning visuals with just a
touch. Whether it’s retouching, color adjustments, or enhancing photo quality, Pixalto has
you covered. Let your creativity shine
</p>
<div class="flex flex-col md:flex-row gap-4">
<a href="">
<img src="https://pixalto.app/build/assets/btn-ios-CB85xJH2.png" alt="">
</a>
<a href="">
<img src="https://pixalto.app/build/assets/btn-android-D5QZNlN5.png" alt="">
</a>
</div>
</div>
<div class="w-full max-w-[550px] block xl:absolute -mt-[150px] mx-auto pl-5" style="right:0;background-image: url(https://pixalto.app/build/assets/bg-icons-mobile-3oz8V8-8.png);background-repeat:no-repeat;background-position:left;">
<img src="https://pixalto.app/build/assets/mobile-BBtaPKs7.png" class="" alt="">
</div>
</div>
</div>
</section>
<section id="tools" class="mb-20 md:mb-32 flex px-2 md:px-10 lg:px-16 container mx-auto">
<div class="w-full mx-auto 2xl:max-w-7xl">
<div>
<h2 class="text-[#004FED] text-[35px] text-center font-bold pb-4">
Tools
</h2>
<p class="text-[#202329] text-[24px] md:text-[45px] text-center font-bold mx-auto">
Empowering Your Creativity: Pixalto’s Tools<br>
Transform Every Pixel.
</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 mt-10">
<div class="col-span-1">
<a href="">
<div class="border-2 border-[#004FED] flex flex-col gap-4 p-4 rounded-3xl h-full">
<img src="https://pixalto.app/build/assets/p1-uWQOxuJW.png" class="w-full" alt="">
<h3 class="font-bold text-[22px]">Add a Touch of Color</h3>
<p class="text-[18px]">
Pixalto can help you adjust the color balance of your photos, making them more vibrant
and appealing.
</p>
</div>
</a>
</div>
<div class="col-span-1">
<a href="">
<div class="border-2 border-[#004FED] flex flex-col gap-4 p-4 rounded-3xl h-full">
<img src="https://pixalto.app/build/assets/p2-CxeXXFKN.png" class="w-full" alt="">
<h3 class="font-bold text-[22px]">Retouch Your Photos</h3>
<p class="text-[18px]">
Pixalto can help you remove blemishes, wrinkles, and other imperfections.
</p>
</div>
</a>
</div>
<div class="col-span-1">
<a href="https://pixalto.app/face-enhance">
<div class="border-2 border-[#004FED] flex flex-col gap-4 p-4 rounded-3xl h-full">
<img src="https://pixalto.app/build/assets/enhance-quality-urPAGkSA.png" class="w-full" alt="Enhance the Quality">
<h3 class="font-bold text-[22px]">Enhance The Quality</h3>
<p class="text-[18px]">
Pixalto uses AI to identify and fix common image problems, such as noise, blur, and poor
lighting.
</p>
</div>
</a>
</div>
<div class="col-span-1">
<a href="https://pixalto.app/remove-background">
<div class="border-2 border-[#004FED] flex flex-col gap-4 p-4 rounded-3xl h-full">
<img src="https://pixalto.app/build/assets/p4-CbSalduG.png" class="w-full" alt="">
<h3 class="font-bold text-[22px]">Background Removal</h3>
<p class="text-[18px]">
The app simplifies complex photo editing techniques, allowing you to produce
high-quality, eye-catching visuals with ease.
</p>
</div>
</a>
</div>
<div class="col-span-1">
<a href="">
<div class="border-2 border-[#004FED] flex flex-col gap-4 p-4 rounded-3xl h-full">
<img src="https://pixalto.app/build/assets/p5-Bv-cw6ZH.png" class="w-full" alt="">
<h3 class="font-bold text-[22px]">Fix Blurry Images</h3>
<p class="text-[18px]">
Whether you’re looking to fix blurry images, Pixalto offers a suite of features to bring
your photos to life.
</p>
</div>
</a>
</div>
<div class="col-span-1">
<a href="https://pixalto.app/cartoon">
<div class="border-2 border-[#004FED] flex flex-col gap-4 p-4 rounded-3xl h-full">
<img src="https://pixalto.app/build/assets/photo-cartoon-group-D1DtRWwx.png" class="w-full " alt="photo to cartoon">
<h3 class="font-bold text-[22px]">Photo To Cartoon</h3>
<p class="text-[18px]">
Pixalto offers an easy-to-use cartoon effect that transform your favorite photos into
fun and unique cartoon versions.
</p>
</div>
</a>
</div>
</div>
</div>
</section>
</div>
<footer class="bg-[#202329] py-20 flex">
<div class="w-full mx-auto 2xl:max-w-7xl px-10">
<div class="grid grid-cols-2 md:grid-cols-4 gap-10">
<div class="flex flex-col gap-8 col-span-1">
<a href="">
<img src="https://pixalto.app/build/assets/logo-CcX8gej_.svg" class="max-w-[200px] w-full" alt="">
</a>
<div class="flex gap-4">
<a href="">
<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" fill="currentColor" class="text-white text-[30px] bi bi-facebook" viewBox="0 0 16 16">
<path d="M16 8.049c0-4.446-3.582-8.05-8-8.05C3.58 0-.002 3.603-.002 8.05c0 4.017 2.926 7.347 6.75 7.951v-5.625h-2.03V8.05H6.75V6.275c0-2.017 1.195-3.131 3.022-3.131.876 0 1.791.157 1.791.157v1.98h-1.009c-.993 0-1.303.621-1.303 1.258v1.51h2.218l-.354 2.326H9.25V16c3.824-.604 6.75-3.934 6.75-7.951"></path>
</svg>
</a>
<a href="">
<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" fill="currentColor" class="text-white text-[30px] bi bi-twitter-x" viewBox="0 0 16 16">
<path d="M12.6.75h2.454l-5.36 6.142L16 15.25h-4.937l-3.867-5.07-4.425 5.07H.316l5.733-6.57L0 .75h5.063l3.495 4.633L12.601.75Zm-.86 13.028h1.36L4.323 2.145H2.865z"></path>
</svg>
</a>
<a href="">
<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" fill="currentColor" class="text-white text-[30px] bi bi-instagram" viewBox="0 0 16 16">
<path d="M8 0C5.829 0 5.556.01 4.703.048 3.85.088 3.269.222 2.76.42a3.9 3.9 0 0 0-1.417.923A3.9 3.9 0 0 0 .42 2.76C.222 3.268.087 3.85.048 4.7.01 5.555 0 5.827 0 8.001c0 2.172.01 2.444.048 3.297.04.852.174 1.433.372 1.942.205.526.478.972.923 1.417.444.445.89.719 1.416.923.51.198 1.09.333 1.942.372C5.555 15.99 5.827 16 8 16s2.444-.01 3.298-.048c.851-.04 1.434-.174 1.943-.372a3.9 3.9 0 0 0 1.416-.923c.445-.445.718-.891.923-1.417.197-.509.332-1.09.372-1.942C15.99 10.445 16 10.173 16 8s-.01-2.445-.048-3.299c-.04-.851-.175-1.433-.372-1.941a3.9 3.9 0 0 0-.923-1.417A3.9 3.9 0 0 0 13.24.42c-.51-.198-1.092-.333-1.943-.372C10.443.01 10.172 0 7.998 0zm-.717 1.442h.718c2.136 0 2.389.007 3.232.046.78.035 1.204.166 1.486.275.373.145.64.319.92.599s.453.546.598.92c.11.281.24.705.275 1.485.039.843.047 1.096.047 3.231s-.008 2.389-.047 3.232c-.035.78-.166 1.203-.275 1.485a2.5 2.5 0 0 1-.599.919c-.28.28-.546.453-.92.598-.28.11-.704.24-1.485.276-.843.038-1.096.047-3.232.047s-2.39-.009-3.233-.047c-.78-.036-1.203-.166-1.485-.276a2.5 2.5 0 0 1-.92-.598 2.5 2.5 0 0 1-.6-.92c-.109-.281-.24-.705-.275-1.485-.038-.843-.046-1.096-.046-3.233s.008-2.388.046-3.231c.036-.78.166-1.204.276-1.486.145-.373.319-.64.599-.92s.546-.453.92-.598c.282-.11.705-.24 1.485-.276.738-.034 1.024-.044 2.515-.045zm4.988 1.328a.96.96 0 1 0 0 1.92.96.96 0 0 0 0-1.92m-4.27 1.122a4.109 4.109 0 1 0 0 8.217 4.109 4.109 0 0 0 0-8.217m0 1.441a2.667 2.667 0 1 1 0 5.334 2.667 2.667 0 0 1 0-5.334"></path>
</svg>
</a>
</div>
</div>
<div class="flex flex-col fap-4 text-white col-span-1">
<span class="mb-5 font-bold ">AI Tools</span>
<a href="https://pixalto.app/remove-background" class="mb-2 hover:text-slate-400 hover:no-underline">Background Remover</a>
<a href="https://pixalto.app/object-eraser" class="mb-2 hover:text-slate-400 hover:no-underline">Object Eraser</a>
<a href="https://pixalto.app/face-talk" class="mb-2 hover:text-slate-400 hover:no-underline">Face Talk</a>
<a href="https://pixalto.app/cartoon" class="mb-2 hover:text-slate-400 hover:no-underline">Cartoon</a>
<a href="https://pixalto.app/sticker" class="mb-2 hover:text-slate-400 hover:no-underline">Sticker</a>
<a href="https://pixalto.app/face-enhance" class="mb-2 hover:text-slate-400 hover:no-underline">Face Enhancer</a>
<a href="https://pixalto.app/face-swap" class="mb-2 hover:text-slate-400 hover:no-underline">Face Swap</a>
<a href="https://pixalto.app/up-scaler" class="mb-2 hover:text-slate-400 hover:no-underline">Up Scaler</a>
</div>
<div class="flex flex-col fap-4 text-white col-span-1">
<span class="mb-5 font-bold">Support</span>
<a href="https://pixalto.app/pricing" class="mb-2 hover:text-slate-400 hover:no-underline">Pricing</a>
<a href="https://pixalto.app/blog" class="mb-2 hover:text-slate-400 hover:no-underline">Blog</a>
<a href="https://pixalto.app/contact-us" class="mb-2 hover:text-slate-400 hover:no-underline">Contact Us</a>
<a href="" class="mb-2 hover:text-slate-400 hover:no-underline">Chat</a>
</div>
<div class="flex flex-col fap-4 text-white col-span-1">
<span class="mb-5 font-bold">LEGAL</span>
<a href="https://pixalto.app/terms" class="mb-2 hover:text-slate-400 hover:no-underline">Terms</a>
<a href="https://pixalto.app/privacy-policy" class="mb-2 hover:text-slate-400 hover:no-underline">Privacy Policy</a>
<a href="https://pixalto.app/security" class="mb-2 hover:text-slate-400 hover:no-underline">Security</a>
<a href="https://pixalto.app/terms-eula" class="mb-2 hover:text-slate-400 hover:no-underline">EULA</a>
</div>
</div>
</div>
</footer>
<div class="subfooter bg-black">
<div class="w-full mx-auto 2xl:max-w-7xl px-10 py-4">
<p class="text-white text-center w-full">
2024 Pixalto. All Rights Reserved.
</p>
</div>
</div>
<script defer="" src="https://static.cloudflareinsights.com/beacon.min.js/vcd15cbe7772f49c399c6a5babf22c1241717689176015" integrity="sha512-ZpsOmlRQV6y907TI0dKBHq9Md29nnaEIPlkf84rnaERnq6zvWvPUqr2ft8M1aS28oN72PdrCzSjY4U6VaAw1EQ==" data-cf-beacon="{"rayId":"8e1c3fde4d78665f","version":"2024.10.5","r":1,"serverTiming":{"name":{"cfExtPri":true,"cfL4":true,"cfSpeedBrain":true,"cfCacheStatus":true}},"token":"67e2bff2bece4c4ca42d2ec4998a0003","b":1}" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/5.3.1/fabric.min.js"></script>
<script data-navigate-once="true">window.livewireScriptConfig = {"csrf":"rh0zY6ISgnU7mNtieAtDRzIChx4mbO9IpDbfYqaY","uri":"\/livewire\/update","progressBar":"","nonce":""};</script>
<div wire:snapshot="{"data":{"isFilamentNotificationsComponent":true,"notifications":[[],{"class":"Filament\\Notifications\\Collection","s":"wrbl"}]},"memo":{"id":"ksmbtqgvWGbLAGbZsl8R","name":"notifications","path":"\/","method":"GET","children":[],"scripts":[],"assets":[],"errors":[],"locale":"en"},"checksum":"fab3a51f357508a58f333e16f1c10764a19edec04f5d7ad0b34f4eb3cb4c7fa8"}" wire:effects="{"listeners":["notificationsSent","notificationSent","notificationClosed"]}" wire:id="ksmbtqgvWGbLAGbZsl8R">
<div class="fi-no pointer-events-none fixed inset-4 z-50 mx-auto flex gap-3 items-end flex-col-reverse justify-end" role="status">
<!--[if BLOCK]><![endif]--><!--[if ENDBLOCK]><![endif]-->
</div>
<!--[if BLOCK]><![endif]--><!--[if ENDBLOCK]><![endif]-->
</div>
<script>
window.filamentData = [] </script>
<script src="https://pixalto.app/js/filament/notifications/notifications.js?v=3.2.123.0"></script>
<script src="https://pixalto.app/js/filament/support/async-alpine.js?v=3.2.123.0"></script>
<script src="https://pixalto.app/js/filament/support/support.js?v=3.2.123.0"></script>
<style>
:root {
}
</style>
<link rel="modulepreload" href="https://pixalto.app/build/assets/upload-BpIprdPV.js"><link rel="modulepreload" href="https://pixalto.app/build/assets/_commonjsHelpers-Cpj98o6Y.js"><script type="module" src="https://pixalto.app/build/assets/upload-BpIprdPV.js" data-navigate-track="reload"></script><link rel="modulepreload" href="https://pixalto.app/build/assets/app-BTehOew9.js"><link rel="modulepreload" href="https://pixalto.app/build/assets/_commonjsHelpers-Cpj98o6Y.js"><script type="module" src="https://pixalto.app/build/assets/app-BTehOew9.js" data-navigate-track="reload"></script><link rel="modulepreload" href="https://pixalto.app/build/assets/object-remover-Dycb3keG.js"><script type="module" src="https://pixalto.app/build/assets/object-remover-Dycb3keG.js" data-navigate-track="reload"></script><script src="https://cdn.paddle.com/paddle/v2/paddle.js"></script>
<script type="text/javascript">
Paddle.Environment.set('sandbox');
</script>
<script type="text/javascript">
Paddle.Initialize({"token":"test_18aee3fdec4ea95dec1d3002976"});
</script>
<script>
document.addEventListener('DOMContentLoaded', () => {
const editor = new ImageEditor('canvas', 'https://pdfwebtools.s3.ap-south-1.amazonaws.com/image_inpainting.png');
});
document.addEventListener('livewire:navigated', function () {
setTimeout(function () {
Livewire.dispatch('process-image');
}, 100); // Adjust the delay time in milliseconds (e.g., 5000 for 5 seconds)
});
</script>
<!-- Default Statcounter code for Pixalto
https://pixalto.app/ -->
<script type="text/javascript">
var sc_project=13051229;
var sc_invisible=1;
var sc_security="ce0be88d";
</script>
<script type="text/javascript" src="https://www.statcounter.com/counter/counter.js" async=""></script>
<noscript><div class="statcounter"><a title="Web Analytics
Made Easy - Statcounter" href="https://statcounter.com/"
target="_blank"><img class="statcounter"
src="https://c.statcounter.com/13051229/0/ce0be88d/1/"
alt="Web Analytics Made Easy - Statcounter"
referrerPolicy="no-referrer-when-downgrade"></a></div></noscript>
<!-- End of Statcounter Code -->
</body></html>