New
Next Generation Template
Core Web Vitals Template for
Onekit is a Bootstrap 5 landing page template with a flat design and fast loading. This template is perfect for building awesome landing page sites.
<!-- =========={ HERO }========== -->
<div id="hero" class="section bg-gradient-primary py-8 py-lg-9 overflow-hidden jarallax"> <!-- background overlay -->
<div class="overlay bg-gradient-primary opacity-90 z-index-n1"></div>
<!-- rocket moving up animation -->
<div class="particle">
<div class="particle-move-up d-none d-lg-block particle-move-up-1 text-light z-index-n1 opacity-60">
<svg xmlns="http://www.w3.org/2000/svg" class="rotate-315" width="2rem" height="2rem" fill="currentColor" viewBox="0 0 512 512"><path d="M461.81,53.81a4.4,4.4,0,0,0-3.3-3.39c-54.38-13.3-180,34.09-248.13,102.17a294.9,294.9,0,0,0-33.09,39.08c-21-1.9-42-.3-59.88,7.5-50.49,22.2-65.18,80.18-69.28,105.07a9,9,0,0,0,9.8,10.4l81.07-8.9a180.29,180.29,0,0,0,1.1,18.3,18.15,18.15,0,0,0,5.3,11.09l31.39,31.39a18.15,18.15,0,0,0,11.1,5.3,179.91,179.91,0,0,0,18.19,1.1l-8.89,81a9,9,0,0,0,10.39,9.79c24.9-4,83-18.69,105.07-69.17,7.8-17.9,9.4-38.79,7.6-59.69a293.91,293.91,0,0,0,39.19-33.09C427.82,233.76,474.91,110.9,461.81,53.81ZM298.66,213.67a42.7,42.7,0,1,1,60.38,0A42.65,42.65,0,0,1,298.66,213.67Z" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/><path class="text-warning" fill="currentColor" d="M109.64,352a45.06,45.06,0,0,0-26.35,12.84C65.67,382.52,64,448,64,448s65.52-1.67,83.15-19.31A44.73,44.73,0,0,0,160,402.32" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/></svg>
</div>
<div class="particle-move-up particle-move-up-2 text-light z-index-n1 opacity-60">
<svg xmlns="http://www.w3.org/2000/svg" class="rotate-315" width="1rem" height="1rem" fill="currentColor" viewBox="0 0 512 512"><path d="M461.81,53.81a4.4,4.4,0,0,0-3.3-3.39c-54.38-13.3-180,34.09-248.13,102.17a294.9,294.9,0,0,0-33.09,39.08c-21-1.9-42-.3-59.88,7.5-50.49,22.2-65.18,80.18-69.28,105.07a9,9,0,0,0,9.8,10.4l81.07-8.9a180.29,180.29,0,0,0,1.1,18.3,18.15,18.15,0,0,0,5.3,11.09l31.39,31.39a18.15,18.15,0,0,0,11.1,5.3,179.91,179.91,0,0,0,18.19,1.1l-8.89,81a9,9,0,0,0,10.39,9.79c24.9-4,83-18.69,105.07-69.17,7.8-17.9,9.4-38.79,7.6-59.69a293.91,293.91,0,0,0,39.19-33.09C427.82,233.76,474.91,110.9,461.81,53.81ZM298.66,213.67a42.7,42.7,0,1,1,60.38,0A42.65,42.65,0,0,1,298.66,213.67Z" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/><path class="text-warning" fill="currentColor" d="M109.64,352a45.06,45.06,0,0,0-26.35,12.84C65.67,382.52,64,448,64,448s65.52-1.67,83.15-19.31A44.73,44.73,0,0,0,160,402.32" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/></svg>
</div>
<div class="particle-move-up d-none d-sm-block particle-move-up-3 text-light z-index-n1 opacity-60">
<svg xmlns="http://www.w3.org/2000/svg" class="rotate-315" width="1.2rem" height="1.2rem" fill="currentColor" viewBox="0 0 512 512"><path d="M461.81,53.81a4.4,4.4,0,0,0-3.3-3.39c-54.38-13.3-180,34.09-248.13,102.17a294.9,294.9,0,0,0-33.09,39.08c-21-1.9-42-.3-59.88,7.5-50.49,22.2-65.18,80.18-69.28,105.07a9,9,0,0,0,9.8,10.4l81.07-8.9a180.29,180.29,0,0,0,1.1,18.3,18.15,18.15,0,0,0,5.3,11.09l31.39,31.39a18.15,18.15,0,0,0,11.1,5.3,179.91,179.91,0,0,0,18.19,1.1l-8.89,81a9,9,0,0,0,10.39,9.79c24.9-4,83-18.69,105.07-69.17,7.8-17.9,9.4-38.79,7.6-59.69a293.91,293.91,0,0,0,39.19-33.09C427.82,233.76,474.91,110.9,461.81,53.81ZM298.66,213.67a42.7,42.7,0,1,1,60.38,0A42.65,42.65,0,0,1,298.66,213.67Z" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/><path class="text-warning" fill="currentColor" d="M109.64,352a45.06,45.06,0,0,0-26.35,12.84C65.67,382.52,64,448,64,448s65.52-1.67,83.15-19.31A44.73,44.73,0,0,0,160,402.32" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/></svg>
</div>
<div class="particle-move-up d-none d-xl-block particle-move-up-4 text-light z-index-n1 opacity-60">
<svg xmlns="http://www.w3.org/2000/svg" class="rotate-315" width="1rem" height="1rem" fill="currentColor" viewBox="0 0 512 512"><path d="M461.81,53.81a4.4,4.4,0,0,0-3.3-3.39c-54.38-13.3-180,34.09-248.13,102.17a294.9,294.9,0,0,0-33.09,39.08c-21-1.9-42-.3-59.88,7.5-50.49,22.2-65.18,80.18-69.28,105.07a9,9,0,0,0,9.8,10.4l81.07-8.9a180.29,180.29,0,0,0,1.1,18.3,18.15,18.15,0,0,0,5.3,11.09l31.39,31.39a18.15,18.15,0,0,0,11.1,5.3,179.91,179.91,0,0,0,18.19,1.1l-8.89,81a9,9,0,0,0,10.39,9.79c24.9-4,83-18.69,105.07-69.17,7.8-17.9,9.4-38.79,7.6-59.69a293.91,293.91,0,0,0,39.19-33.09C427.82,233.76,474.91,110.9,461.81,53.81ZM298.66,213.67a42.7,42.7,0,1,1,60.38,0A42.65,42.65,0,0,1,298.66,213.67Z" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/><path class="text-warning" fill="currentColor" d="M109.64,352a45.06,45.06,0,0,0-26.35,12.84C65.67,382.52,64,448,64,448s65.52-1.67,83.15-19.31A44.73,44.73,0,0,0,160,402.32" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/></svg>
</div>
<div class="particle-move-up d-none d-sm-block particle-move-up-5 text-light z-index-n1 opacity-60">
<svg xmlns="http://www.w3.org/2000/svg" class="rotate-315" width="1.2rem" height="1.2rem" fill="currentColor" viewBox="0 0 512 512"><path d="M461.81,53.81a4.4,4.4,0,0,0-3.3-3.39c-54.38-13.3-180,34.09-248.13,102.17a294.9,294.9,0,0,0-33.09,39.08c-21-1.9-42-.3-59.88,7.5-50.49,22.2-65.18,80.18-69.28,105.07a9,9,0,0,0,9.8,10.4l81.07-8.9a180.29,180.29,0,0,0,1.1,18.3,18.15,18.15,0,0,0,5.3,11.09l31.39,31.39a18.15,18.15,0,0,0,11.1,5.3,179.91,179.91,0,0,0,18.19,1.1l-8.89,81a9,9,0,0,0,10.39,9.79c24.9-4,83-18.69,105.07-69.17,7.8-17.9,9.4-38.79,7.6-59.69a293.91,293.91,0,0,0,39.19-33.09C427.82,233.76,474.91,110.9,461.81,53.81ZM298.66,213.67a42.7,42.7,0,1,1,60.38,0A42.65,42.65,0,0,1,298.66,213.67Z" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/><path class="text-warning" fill="currentColor" d="M109.64,352a45.06,45.06,0,0,0-26.35,12.84C65.67,382.52,64,448,64,448s65.52-1.67,83.15-19.31A44.73,44.73,0,0,0,160,402.32" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/></svg>
</div>
<div class="particle-move-up border-success text-light particle-move-up-6 z-index-n1 opacity-60">
<svg xmlns="http://www.w3.org/2000/svg" class="rotate-315" width="2rem" height="2rem" fill="currentColor" viewBox="0 0 512 512"><path d="M461.81,53.81a4.4,4.4,0,0,0-3.3-3.39c-54.38-13.3-180,34.09-248.13,102.17a294.9,294.9,0,0,0-33.09,39.08c-21-1.9-42-.3-59.88,7.5-50.49,22.2-65.18,80.18-69.28,105.07a9,9,0,0,0,9.8,10.4l81.07-8.9a180.29,180.29,0,0,0,1.1,18.3,18.15,18.15,0,0,0,5.3,11.09l31.39,31.39a18.15,18.15,0,0,0,11.1,5.3,179.91,179.91,0,0,0,18.19,1.1l-8.89,81a9,9,0,0,0,10.39,9.79c24.9-4,83-18.69,105.07-69.17,7.8-17.9,9.4-38.79,7.6-59.69a293.91,293.91,0,0,0,39.19-33.09C427.82,233.76,474.91,110.9,461.81,53.81ZM298.66,213.67a42.7,42.7,0,1,1,60.38,0A42.65,42.65,0,0,1,298.66,213.67Z" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/><path class="text-warning" fill="currentColor" d="M109.64,352a45.06,45.06,0,0,0-26.35,12.84C65.67,382.52,64,448,64,448s65.52-1.67,83.15-19.31A44.73,44.73,0,0,0,160,402.32" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/></svg>
</div>
<div class="particle-move-up particle-move-up-7 z-index-n1 text-light opacity-60">
<svg xmlns="http://www.w3.org/2000/svg" class="rotate-315" width="1.2rem" height="1.2rem" fill="currentColor" viewBox="0 0 512 512"><path d="M461.81,53.81a4.4,4.4,0,0,0-3.3-3.39c-54.38-13.3-180,34.09-248.13,102.17a294.9,294.9,0,0,0-33.09,39.08c-21-1.9-42-.3-59.88,7.5-50.49,22.2-65.18,80.18-69.28,105.07a9,9,0,0,0,9.8,10.4l81.07-8.9a180.29,180.29,0,0,0,1.1,18.3,18.15,18.15,0,0,0,5.3,11.09l31.39,31.39a18.15,18.15,0,0,0,11.1,5.3,179.91,179.91,0,0,0,18.19,1.1l-8.89,81a9,9,0,0,0,10.39,9.79c24.9-4,83-18.69,105.07-69.17,7.8-17.9,9.4-38.79,7.6-59.69a293.91,293.91,0,0,0,39.19-33.09C427.82,233.76,474.91,110.9,461.81,53.81ZM298.66,213.67a42.7,42.7,0,1,1,60.38,0A42.65,42.65,0,0,1,298.66,213.67Z" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/><path class="text-warning" fill="currentColor" d="M109.64,352a45.06,45.06,0,0,0-26.35,12.84C65.67,382.52,64,448,64,448s65.52-1.67,83.15-19.31A44.73,44.73,0,0,0,160,402.32" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/></svg>
</div>
<div class="particle-move-up particle-move-up-8 z-index-n1 text-light opacity-60">
<svg xmlns="http://www.w3.org/2000/svg" class="rotate-315" width="1.2rem" height="1.2rem" fill="currentColor" viewBox="0 0 512 512"><path d="M461.81,53.81a4.4,4.4,0,0,0-3.3-3.39c-54.38-13.3-180,34.09-248.13,102.17a294.9,294.9,0,0,0-33.09,39.08c-21-1.9-42-.3-59.88,7.5-50.49,22.2-65.18,80.18-69.28,105.07a9,9,0,0,0,9.8,10.4l81.07-8.9a180.29,180.29,0,0,0,1.1,18.3,18.15,18.15,0,0,0,5.3,11.09l31.39,31.39a18.15,18.15,0,0,0,11.1,5.3,179.91,179.91,0,0,0,18.19,1.1l-8.89,81a9,9,0,0,0,10.39,9.79c24.9-4,83-18.69,105.07-69.17,7.8-17.9,9.4-38.79,7.6-59.69a293.91,293.91,0,0,0,39.19-33.09C427.82,233.76,474.91,110.9,461.81,53.81ZM298.66,213.67a42.7,42.7,0,1,1,60.38,0A42.65,42.65,0,0,1,298.66,213.67Z" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/><path class="text-warning" fill="currentColor" d="M109.64,352a45.06,45.06,0,0,0-26.35,12.84C65.67,382.52,64,448,64,448s65.52-1.67,83.15-19.31A44.73,44.73,0,0,0,160,402.32" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/></svg>
</div>
<div class="particle-move-up particle-move-up-9 z-index-n1 text-light opacity-60">
<svg xmlns="http://www.w3.org/2000/svg" class="rotate-315" width="2rem" height="2rem" fill="currentColor" viewBox="0 0 512 512"><path d="M461.81,53.81a4.4,4.4,0,0,0-3.3-3.39c-54.38-13.3-180,34.09-248.13,102.17a294.9,294.9,0,0,0-33.09,39.08c-21-1.9-42-.3-59.88,7.5-50.49,22.2-65.18,80.18-69.28,105.07a9,9,0,0,0,9.8,10.4l81.07-8.9a180.29,180.29,0,0,0,1.1,18.3,18.15,18.15,0,0,0,5.3,11.09l31.39,31.39a18.15,18.15,0,0,0,11.1,5.3,179.91,179.91,0,0,0,18.19,1.1l-8.89,81a9,9,0,0,0,10.39,9.79c24.9-4,83-18.69,105.07-69.17,7.8-17.9,9.4-38.79,7.6-59.69a293.91,293.91,0,0,0,39.19-33.09C427.82,233.76,474.91,110.9,461.81,53.81ZM298.66,213.67a42.7,42.7,0,1,1,60.38,0A42.65,42.65,0,0,1,298.66,213.67Z" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/><path class="text-warning" fill="currentColor" d="M109.64,352a45.06,45.06,0,0,0-26.35,12.84C65.67,382.52,64,448,64,448s65.52-1.67,83.15-19.31A44.73,44.73,0,0,0,160,402.32" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/></svg>
</div>
</div>
<!-- scribble -->
<figure class="scribble scale-4 opacity-10 top-50 start-0 z-index-n1" data-aos="fade-up-right" data-aos-delay="400">
<svg class="text-secondary" width="200" height="200" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
<path fill="currentColor" d="M42.5,-66.2C57.1,-56.7,72.5,-48.4,81.1,-35.3C89.8,-22.2,91.8,-4.4,89.6,13C87.3,30.4,80.7,47.4,69.5,60.1C58.3,72.9,42.4,81.5,25.9,84.6C9.5,87.8,-7.4,85.4,-22.7,79.8C-37.9,74.1,-51.5,65.2,-60.9,53.3C-70.4,41.4,-75.8,26.6,-79,10.8C-82.1,-5,-83.1,-21.7,-77.7,-36.4C-72.4,-51,-60.7,-63.7,-46.7,-73.5C-32.7,-83.3,-16.4,-90.1,-1.2,-88.2C13.9,-86.3,27.8,-75.7,42.5,-66.2Z" transform="translate(100 100)" />
</svg>
</figure>
<!-- scribble -->
<figure class="scribble scale-5 opacity-10 top-50 start-0 z-index-n1" data-aos="fade-up-right" data-aos-delay="300">
<svg class="text-secondary" width="200" height="200" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
<path fill="currentColor" d="M42.5,-66.2C57.1,-56.7,72.5,-48.4,81.1,-35.3C89.8,-22.2,91.8,-4.4,89.6,13C87.3,30.4,80.7,47.4,69.5,60.1C58.3,72.9,42.4,81.5,25.9,84.6C9.5,87.8,-7.4,85.4,-22.7,79.8C-37.9,74.1,-51.5,65.2,-60.9,53.3C-70.4,41.4,-75.8,26.6,-79,10.8C-82.1,-5,-83.1,-21.7,-77.7,-36.4C-72.4,-51,-60.7,-63.7,-46.7,-73.5C-32.7,-83.3,-16.4,-90.1,-1.2,-88.2C13.9,-86.3,27.8,-75.7,42.5,-66.2Z" transform="translate(100 100)" />
</svg>
</figure>
<!-- scribble -->
<figure class="scribble scale-6 opacity-10 top-50 start-0 z-index-n1" data-aos="fade-up-right" data-aos-delay="200">
<svg class="text-secondary" width="200" height="200" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
<path fill="currentColor" d="M42.5,-66.2C57.1,-56.7,72.5,-48.4,81.1,-35.3C89.8,-22.2,91.8,-4.4,89.6,13C87.3,30.4,80.7,47.4,69.5,60.1C58.3,72.9,42.4,81.5,25.9,84.6C9.5,87.8,-7.4,85.4,-22.7,79.8C-37.9,74.1,-51.5,65.2,-60.9,53.3C-70.4,41.4,-75.8,26.6,-79,10.8C-82.1,-5,-83.1,-21.7,-77.7,-36.4C-72.4,-51,-60.7,-63.7,-46.7,-73.5C-32.7,-83.3,-16.4,-90.1,-1.2,-88.2C13.9,-86.3,27.8,-75.7,42.5,-66.2Z" transform="translate(100 100)" />
</svg>
</figure>
<!-- scribble -->
<figure class="scribble scale-7 opacity-10 top-50 start-0 z-index-n1" data-aos="fade-up-right" data-aos-delay="100">
<svg class="text-secondary" width="200" height="200" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
<path fill="currentColor" d="M42.5,-66.2C57.1,-56.7,72.5,-48.4,81.1,-35.3C89.8,-22.2,91.8,-4.4,89.6,13C87.3,30.4,80.7,47.4,69.5,60.1C58.3,72.9,42.4,81.5,25.9,84.6C9.5,87.8,-7.4,85.4,-22.7,79.8C-37.9,74.1,-51.5,65.2,-60.9,53.3C-70.4,41.4,-75.8,26.6,-79,10.8C-82.1,-5,-83.1,-21.7,-77.7,-36.4C-72.4,-51,-60.7,-63.7,-46.7,-73.5C-32.7,-83.3,-16.4,-90.1,-1.2,-88.2C13.9,-86.3,27.8,-75.7,42.5,-66.2Z" transform="translate(100 100)" />
</svg>
</figure>
<div class="container">
<!-- row -->
<div class="row justify-content-center">
<!-- hero content -->
<div class="col-md-9 col-lg-6 align-self-center pe-lg-5" data-aos="flip-up">
<div class="text-center text-lg-start mt-4 mt-lg-0">
<div class="mb-3">
<span class="badge badge-soft-light rounded">New</span>
<span class="text-light ms-1">Next Generation Template</span>
</div>
<div class="mb-5">
<h1 class="display-5 fw-bold text-white mb-3"><span class="text-warning">Core Web Vitals</span> Template for <span data-toggle="typed" data-options='{"strings": ["Apps", "StartUp", "Company", "Portfolio"]}'></span>
</h1>
<p class="lead text-light">Onekit is a Bootstrap 5 landing page template with a flat design and fast loading. This template is perfect for building awesome landing page sites.</p>
</div>
<a class="btn btn-white hover-button-up" href="#about">
<!-- <i class="fas fa-desktop"></i> -->
<svg class="bi bi-book me-2" width="1.2rem" height="1.2rem" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M3.214 1.072C4.813.752 6.916.71 8.354 2.146A.5.5 0 018.5 2.5v11a.5.5 0 01-.854.354c-.843-.844-2.115-1.059-3.47-.92-1.344.14-2.66.617-3.452 1.013A.5.5 0 010 13.5v-11a.5.5 0 01.276-.447L.5 2.5l-.224-.447.002-.001.004-.002.013-.006a5.017 5.017 0 01.22-.103 12.958 12.958 0 012.7-.869zM1 2.82v9.908c.846-.343 1.944-.672 3.074-.788 1.143-.118 2.387-.023 3.426.56V2.718c-1.063-.929-2.631-.956-4.09-.664A11.958 11.958 0 001 2.82z" clip-rule="evenodd"></path>
<path fill-rule="evenodd" d="M12.786 1.072C11.188.752 9.084.71 7.646 2.146A.5.5 0 007.5 2.5v11a.5.5 0 00.854.354c.843-.844 2.115-1.059 3.47-.92 1.344.14 2.66.617 3.452 1.013A.5.5 0 0016 13.5v-11a.5.5 0 00-.276-.447L15.5 2.5l.224-.447-.002-.001-.004-.002-.013-.006-.047-.023a12.582 12.582 0 00-.799-.34 12.96 12.96 0 00-2.073-.609zM15 2.82v9.908c-.846-.343-1.944-.672-3.074-.788-1.143-.118-2.387-.023-3.426.56V2.718c1.063-.929 2.631-.956 4.09-.664A11.956 11.956 0 0115 2.82z" clip-rule="evenodd"></path>
</svg> Our story
</a>
</div>
</div>
<!-- hero image -->
<div class="col-md-9 col-lg-6 align-self-center">
<div class="px-3 px-sm-7 px-md-2 px-xl-7 mt-5 mt-lg-0 mb-n9" data-aos="fade-up" data-aos-delay="100">
<img class="img-fluid animated-up-down" src="src/img-min/svg/start_up.svg" alt="images title">
</div>
</div>
</div><!-- end row -->
</div>
<!-- waves start -->
<figure class="waves-bottom-center text-light-dark mb-lg-n4 z-index-n1">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320">
<path class="opacity-20 translate-top-2" fill="currentColor" fill-opacity="1" d="M0,160L60,186.7C120,213,240,267,360,245.3C480,224,600,128,720,106.7C840,85,960,139,1080,149.3C1200,160,1320,128,1380,112L1440,96L1440,320L1380,320C1320,320,1200,320,1080,320C960,320,840,320,720,320C600,320,480,320,360,320C240,320,120,320,60,320L0,320Z"></path>
<path class="opacity-30 translate-top-1" fill="currentColor" fill-opacity="1" d="M0,160L60,186.7C120,213,240,267,360,245.3C480,224,600,128,720,106.7C840,85,960,139,1080,149.3C1200,160,1320,128,1380,112L1440,96L1440,320L1380,320C1320,320,1200,320,1080,320C960,320,840,320,720,320C600,320,480,320,360,320C240,320,120,320,60,320L0,320Z"></path>
<path fill="currentColor" fill-opacity="1" d="M0,160L60,186.7C120,213,240,267,360,245.3C480,224,600,128,720,106.7C840,85,960,139,1080,149.3C1200,160,1320,128,1380,112L1440,96L1440,320L1380,320C1320,320,1200,320,1080,320C960,320,840,320,720,320C600,320,480,320,360,320C240,320,120,320,60,320L0,320Z"></path>
</svg>
</figure>
</div><!-- end hero -->
Onekit Cleaner App
This is the most useful application for your smartphone. Easy to cleaning trash, battery saver and Ram Booster applications.
<!-- =========={ HERO }========== -->
<div id="hero" class="section pt-5 pt-sm-6 pt-lg-9 pt-xl-8 pb-7 pb-md-9 mt-6 mt-lg-0 border-bottom" style="background-image: url('src/img-min/app/app-mobile2.jpg');background-size: cover;">
<!-- background overlay -->
<div class="overlay bg-gradient-primary opacity-90 z-index-n1"></div>
<div class="container">
<div class="row align-items-center justify-content-center">
<!-- content -->
<div class="col-lg-6 me-xl-auto" data-aos="fade-up">
<div class="mt-5 text-center text-lg-start">
<h1 class="display-4 text-shadow fw-bold text-white mb-3"><span class="text-warning">Onekit</span> Cleaner App</h1>
<p class="lead text-light mb-5">This is the most useful application for your smartphone. Easy to cleaning trash, battery saver and Ram Booster applications.</p>
<div class="mb-5">
<!-- APP STORE -->
<a class="btn btn-outline-white btn-app text-start mb-3 mb-sm-0 me-sm-4" href="https://itunes.apple.com">
<span class="d-flex align-items-center">
<!--icon-->
<span class="me-2">
<!-- <span class="fab fa-apple fs-2"></span> -->
<svg xmlns="http://www.w3.org/2000/svg" width="2rem" height="2rem" fill="currentColor" viewBox="0 0 512 512"><path d="M349.13,136.86c-40.32,0-57.36,19.24-85.44,19.24C234.9,156.1,212.94,137,178,137c-34.2,0-70.67,20.88-93.83,56.45-32.52,50.16-27,144.63,25.67,225.11,18.84,28.81,44,61.12,77,61.47h.6c28.68,0,37.2-18.78,76.67-19h.6c38.88,0,46.68,18.89,75.24,18.89h.6c33-.35,59.51-36.15,78.35-64.85,13.56-20.64,18.6-31,29-54.35-76.19-28.92-88.43-136.93-13.08-178.34-23-28.8-55.32-45.48-85.79-45.48Z"/><path d="M340.25,32c-24,1.63-52,16.91-68.4,36.86-14.88,18.08-27.12,44.9-22.32,70.91h1.92c25.56,0,51.72-15.39,67-35.11C333.17,85.89,344.33,59.29,340.25,32Z"/></svg>
</span>
<!--text-->
<span class="app-text">
<span class="small d-block">Download on the</span>
<strong>App Store</strong>
</span><!--end text-->
</span>
</a>
<!-- PLAY STORE -->
<a class="btn btn-outline-white btn-app text-start mb-3 mb-sm-0" href="https://play.google.com">
<span class="d-flex align-items-center">
<!--icon-->
<span class="me-2">
<!-- <span class="fab fa-google-play fs-2"></span> -->
<svg xmlns="http://www.w3.org/2000/svg" width="2rem" height="2rem" fill="currentColor" viewBox="0 0 512 512"><path d="M48,59.49v393a4.33,4.33,0,0,0,7.37,3.07L260,256,55.37,56.42A4.33,4.33,0,0,0,48,59.49Z"/><path d="M345.8,174,89.22,32.64l-.16-.09c-4.42-2.4-8.62,3.58-5,7.06L285.19,231.93Z"/><path d="M84.08,472.39c-3.64,3.48.56,9.46,5,7.06l.16-.09L345.8,338l-60.61-57.95Z"/><path d="M449.38,231l-71.65-39.46L310.36,256l67.37,64.43L449.38,281C468.87,270.23,468.87,241.77,449.38,231Z"/></svg>
</span>
<!--text-->
<span class="app-text">
<span class="d-block small">Get it on</span>
<strong>Google Play</strong>
</span><!--end text-->
</span>
</a>
</div>
</div>
</div><!-- end content -->
<!-- intro images -->
<div class="col-md-8 col-lg-6 col-xl-5 px-7">
<div class="position-relative mt-md-n2 mb-6" style="padding-bottom: 120%">
<figure class="position-absolute start-0 top-0 w-75" data-aos="fade-left">
<svg version="1.0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 480.000000 906.000000">
<!-- Clip path image -->
<defs>
<clipPath id="svgf">
<rect x="52" y="10" width="380" height="818"/>
</clipPath>
</defs>
<!-- Phone screen -->
<image clip-path="url(#svgf)" xlink:href="src/img-min/app/app3.jpg" height="92%" width="100%" style="transform:translateY(24px);"></image>
<!-- Phone cover -->
<image xlink:href="src/img-min/app/device/iphone-dark.png" height="100%" width="100%"></image>
</svg>
</figure>
<figure class="position-absolute end-0 w-75" style="top:12%" data-aos="fade-left" data-aos-delay="200">
<svg version="1.0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 480.000000 906.000000">
<!-- Clip path image -->
<defs>
<clipPath id="svgf1">
<rect x="52" y="10" width="380" height="818"/>
</clipPath>
</defs>
<!-- Phone screen -->
<image clip-path="url(#svgf1)" xlink:href="src/img-min/app/app1.jpg" height="92%" width="100%" style="transform:translateY(30px);"></image>
<!-- Phone cover -->
<image xlink:href="src/img-min/app/device/iphone-dark.png" height="100%" width="100%"></image>
</svg>
</figure>
</div>
</div>
</div>
</div>
<!-- waves start -->
<figure class="waves-bottom-center waves-animate z-index-n1">
<svg xmlns="http://www.w3.org/2000/svg" class="text-white-black" viewBox="0 0 1440 320"><path fill="currentColor" fill-opacity="1" d="M0,160L34.3,181.3C68.6,203,137,245,206,240C274.3,235,343,181,411,170.7C480,160,549,192,617,202.7C685.7,213,754,203,823,186.7C891.4,171,960,149,1029,138.7C1097.1,128,1166,128,1234,117.3C1302.9,107,1371,85,1406,74.7L1440,64L1440,320L1405.7,320C1371.4,320,1303,320,1234,320C1165.7,320,1097,320,1029,320C960,320,891,320,823,320C754.3,320,686,320,617,320C548.6,320,480,320,411,320C342.9,320,274,320,206,320C137.1,320,69,320,34,320L0,320Z"></path></svg>
</figure>
</div><!-- end hero -->
Amazing Portfolio
Do the difficult things while they are easy and do the great things while they are small. A journey of a thousand miles begins with a single step.
Our Portfolio
<!-- =========={ HERO }========== -->
<div id="hero" class="section py-7 py-md-8 jarallax" data-jarallax-video="https://www.youtube.com/watch?v=6stlCkUDG_s">
<!-- background overlay -->
<div class="overlay bg-primary opacity-90 z-index-n1"></div>
<div class="container">
<div class="row justify-content-center">
<!-- content -->
<div class="col-lg-7" data-aos="fade-up">
<div class="mt-6 mt-lg-4 py-0 py-lg-5 text-center">
<h1 class="display-4 fw-bold text-white mb-3">Amazing <span class="fw-light">Portfolio</span></h1>
<p class="lead text-light mb-5">Do the difficult things while they are easy and do the great things while they are small. A journey of a thousand miles begins with a single step.</p>
<a href="#portfolio" class="btn btn-warning">
<!-- <i class="fas fa-paper-plane me-2"></i> -->
<svg xmlns="http://www.w3.org/2000/svg" width="1.5rem" height="1.5rem" class="me-2 rtl-270" fill="currentColor" viewBox="0 0 512 512"><path d="M53.12,199.94l400-151.39a8,8,0,0,1,10.33,10.33l-151.39,400a8,8,0,0,1-15-.34L229.66,292.45a16,16,0,0,0-10.11-10.11L53.46,215A8,8,0,0,1,53.12,199.94Z" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/><line x1="460" y1="52" x2="227" y2="285" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/></svg>
Our Portfolio
</a>
</div>
</div><!-- end content -->
</div>
</div>
<!-- mathead -->
<div class="masthead animated-up-down d-none d-md-block">
<a href="#about">
<div class="mouse-icon">
<div class="scroller"></div>
</div>
</a>
</div>
</div><!-- end hero -->
Coding course
A place to learn programming & various other technologies, specifically and intensively in only one platform.
Join Now Free Tshirt
<!-- =========={ HERO }========== -->
<div id="hero" class="section pt-7 pt-md-8 pb-7 pb-md-8" style="background-image: url('src/img-min/bg/bg-coding.jpg');background-size: cover;">
<!-- background overlay -->
<div class="overlay bg-gradient-primary opacity-90 z-index-n1"></div>
<div class="container">
<div class="row align-items-center justify-content-center">
<!-- content -->
<div class="col-11 col-lg-7" data-aos="fade-up">
<div class="mt-6 mt-lg-4 py-0 py-lg-5 text-center">
<h1 class="display-5 fw-bold text-white text-shadow text-uppercase mb-3">Coding course</h1>
<p class="lead text-light mb-5">A place to learn programming & various other technologies, specifically and intensively in only one platform.</p>
<a class="btn btn-warning mb-3 mb-sm-0 me-sm-4" href="#pricing">
<!-- <i class="fas fa-paper-plane me-2"></i> -->
<svg xmlns="http://www.w3.org/2000/svg" width="1rem" height="1rem" class="me-2 rtl-270" fill="currentColor" viewBox="0 0 512 512"><path d="M53.12,199.94l400-151.39a8,8,0,0,1,10.33,10.33l-151.39,400a8,8,0,0,1-15-.34L229.66,292.45a16,16,0,0,0-10.11-10.11L53.46,215A8,8,0,0,1,53.12,199.94Z" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"></path><line x1="460" y1="52" x2="227" y2="285" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"></line></svg>
Join Now
</a>
<a class="btn btn-outline-white mb-3 mb-sm-0" href="#bonus">
<!-- <i class="fas fa-tshirt me-1"></i> -->
<svg xmlns="http://www.w3.org/2000/svg" width="1rem" height="1rem" class="me-2" fill="currentColor" viewBox="0 0 512 512"><path d="M314.56,48S291.78,56,256,56s-58.56-8-58.56-8a31.94,31.94,0,0,0-10.57,1.8L32,104l16.63,88,48.88,5.52A24,24,0,0,1,118.8,222.1L112,464H400l-6.8-241.9a24,24,0,0,1,21.29-24.58L463.37,192,480,104,325.13,49.8A31.94,31.94,0,0,0,314.56,48Z" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/><path d="M333.31,52.66a80,80,0,0,1-154.62,0" style="fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/></svg>
Free Tshirt
</a>
</div>
</div><!-- end content -->
</div>
<!-- masthead -->
<div class="masthead animated-up-down d-none d-md-block">
<a href="#material">
<div class="mouse-icon">
<div class="scroller"><span class="visually-hidden">Scroll button</span></div>
</div>
</a>
</div>
</div>
</div><!-- end hero -->
Download for your Device
Onekit sales management software, the app for easy to manage your Ecommerce.
Download on the App Store Get it on Google Play Download from Windows Store
<!-- =========={ HERO }========== -->
<div id="hero" class="section pt-8 pb-7 mt-4 mt-lg-0 bg-body jarallax">
<!-- background parallax -->
<img class="jarallax-img" src="src/img-min/bg/bg3.jpg" alt="title">
<!-- background overlay -->
<div class="overlay bg-body opacity-90"></div>
<!-- hero content -->
<div class="container text-center">
<div class="row align-items-center">
<!-- images -->
<div class="col-md-6 mx-auto align-self-end" data-aos="fade-in">
<div class="position-relative mb-4" style="padding-bottom:66%">
<!-- Macbook -->
<figure class="position-absolute top-0 end-0 w-100" data-aos="fade-left">
<svg version="1.0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 960.000000 574.000000">
<!-- Clip path image -->
<defs>
<clipPath id="svgf77">
<rect y="40" x="98" width="735" height="470"></rect>
</clipPath>
</defs>
<!-- Phone screen -->
<image clip-path="url(#svgf77)" xlink:href="src/img/app/macbook-screen.jpg" height="100%" width="100%" style="transform:translateX(15px);"></image>
<!-- Phone cover -->
<image xlink:href="src/img/app/device/macbook.png" height="100%" width="100%"></image>
</svg>
</figure>
<!-- Iphone potrait -->
<figure class="position-absolute start-0 bottom-1 w-25" data-aos="fade-right">
<svg version="1.0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 480.000000 906.000000">
<!-- Clip path image -->
<defs>
<clipPath id="svgf2">
<rect x="52" y="10" width="380" height="818"/>
</clipPath>
</defs>
<!-- Phone screen -->
<image clip-path="url(#svgf2)" xlink:href="src/img-min/app/iphone-potrait.jpg" height="92%" width="100%" style="transform:translateY(30px);"></image>
<!-- Phone cover -->
<image xlink:href="src/img-min/app/device/iphone-dark.png" height="100%" width="100%"></image>
</svg>
</figure>
</div>
</div>
<!-- content text -->
<div class="col-md-8 mt-3 mt-lg-0 text-center mx-auto z-index-1">
<h1 class="fw-bold mb-3">Download for your Device</h1>
<p class="lead text-muted mb-5">Onekit sales management software, the app for easy to manage your Ecommerce.</p>
<!-- APP STORE -->
<a class="btn btn-dark btn-app text-white text-start mb-3 mb-sm-0 me-sm-4" href="https://itunes.apple.com">
<span class="d-flex align-items-center">
<!--icon-->
<span class="me-2">
<!-- <span class="fab fa-apple fs-2"></span> -->
<svg xmlns="http://www.w3.org/2000/svg" width="2rem" height="2rem" fill="currentColor" viewBox="0 0 512 512"><path d="M349.13,136.86c-40.32,0-57.36,19.24-85.44,19.24C234.9,156.1,212.94,137,178,137c-34.2,0-70.67,20.88-93.83,56.45-32.52,50.16-27,144.63,25.67,225.11,18.84,28.81,44,61.12,77,61.47h.6c28.68,0,37.2-18.78,76.67-19h.6c38.88,0,46.68,18.89,75.24,18.89h.6c33-.35,59.51-36.15,78.35-64.85,13.56-20.64,18.6-31,29-54.35-76.19-28.92-88.43-136.93-13.08-178.34-23-28.8-55.32-45.48-85.79-45.48Z"/><path d="M340.25,32c-24,1.63-52,16.91-68.4,36.86-14.88,18.08-27.12,44.9-22.32,70.91h1.92c25.56,0,51.72-15.39,67-35.11C333.17,85.89,344.33,59.29,340.25,32Z"/></svg>
</span>
<!--text-->
<span class="app-text">
<span class="small d-block">Download on the</span>
<strong>App Store</strong>
</span><!--end text-->
</span>
</a>
<!-- PLAY STORE -->
<a class="btn btn-dark btn-app text-white text-start mb-3 mb-sm-0 me-sm-4" href="https://play.google.com">
<span class="d-flex align-items-center">
<!--icon-->
<span class="me-2">
<!-- <span class="fab fa-google-play fs-2"></span> -->
<svg xmlns="http://www.w3.org/2000/svg" width="2rem" height="2rem" fill="currentColor" viewBox="0 0 512 512"><path d="M48,59.49v393a4.33,4.33,0,0,0,7.37,3.07L260,256,55.37,56.42A4.33,4.33,0,0,0,48,59.49Z"/><path d="M345.8,174,89.22,32.64l-.16-.09c-4.42-2.4-8.62,3.58-5,7.06L285.19,231.93Z"/><path d="M84.08,472.39c-3.64,3.48.56,9.46,5,7.06l.16-.09L345.8,338l-60.61-57.95Z"/><path d="M449.38,231l-71.65-39.46L310.36,256l67.37,64.43L449.38,281C468.87,270.23,468.87,241.77,449.38,231Z"/></svg>
</span>
<!--text-->
<span class="app-text">
<span class="d-block small">Get it on</span>
<strong>Google Play</strong>
</span><!--end text-->
</span>
</a>
<!-- WINDOWS APP -->
<a class="btn btn-dark btn-app text-white text-start mb-3 mb-sm-0" href="https://www.microsoft.com/en-us/store/apps">
<span class="d-flex align-items-center">
<!--icon-->
<span class="me-2">
<!-- <span class="fab fa-windows fs-2"></span> -->
<svg xmlns="http://www.w3.org/2000/svg" width="2rem" height="2rem" fill="currentColor" viewBox="0 0 512 512"><path d="M480,265H232V444l248,36V265Z"/><path d="M216,265H32V415l184,26.7V265Z"/><path d="M480,32,232,67.4V249H480V32Z"/><path d="M216,69.7,32,96V249H216V69.7Z"/></svg>
</span>
<!--text-->
<span class="app-text">
<span class="d-block small">Download from</span>
<strong>Windows Store</strong>
</span><!--end text-->
</span>
</a>
</div><!-- end content text -->
</div>
</div>
</div><!-- end hero -->