1<!DOCTYPE html><html lang="en"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1"><meta name="astro-view-transitions-enabled" content="true"><meta name="astro-view-transitions-fallback" content="animate">
1<script type="module" src="/_astro/ClientRouter.astro_astro_type_script_index_0_lang.j56hQv-j.js"></script>
1<!-- Primary SEO --><title>Oursky - Build it right the First Time</title><meta name="description" content="We are a developer-led software agency comprising a diverse team of experts who work with startups and enterprises to create award-winning digital experiences and fast-track digital transformation."><link rel="canonical" href="https://www.oursky.com/"><!-- Open Graph --><meta property="og:type" content="website"><meta property="og:title" content="Oursky - Build it right the First Time"><meta property="og:description" content="We are a developer-led software agency comprising a diverse team of experts who work with startups and enterprises to create award-winning digital experiences and fast-track digital transformation."><meta property="og:url" content="https://www.oursky.com/"><meta property="og:image" content="https://www.oursky.com/images/og-default.png"><meta property="og:site_name" content="Oursky"><!-- Twitter Card --><meta name="twitter:card" content="summary_large_image"><meta name="twitter:title" content="Oursky - Build it right the First Time"><meta name="twitter:description" content="We are a developer-led software agency comprising a diverse team of experts who work with startups and enterprises to create award-winning digital experiences and fast-track digital transformation."><meta name="twitter:image" content="https://www.oursky.com/images/og-default.png"><!-- Favicon --><link rel="icon" type="image/png" href="/favicon.png"><link rel="apple-touch-icon" href="/apple-touch-icon.png"><!-- Borna Webfont is self-hosted via @font-face in global.css --><!-- Preload the most-used weights for faster LCP --><link rel="preload" href="/fonts/borna-regular.woff2" as="font" type="font/woff2" crossorigin><link rel="preload" href="/fonts/borna-medium.woff2" as="font" type="font/woff2" crossorigin><!-- Structured data -->
1<script type="application/ld+json">{"@context":"https://schema.org","@type":"Organization","@id":"https://www.oursky.com/#organization","name":"Oursky","url":"https://www.oursky.com/","logo":"https://www.oursky.com/images/og-default.png","sameAs":["https://www.linkedin.com/company/oursky-limited/","https://www.facebook.com/oursky.hk","https://www.instagram.com/oursky.hk/","https://twitter.com/oursky","https://github.com/oursky"]}</script>
1<script type="application/ld+json">{"@context":"https://schema.org","@type":"WebSite","@id":"https://www.oursky.com/#website","url":"https://www.oursky.com/","name":"Oursky","publisher":{"@id":"https://www.oursky.com/#organization"},"inLanguage":"en"}</script>
1<script async src="https://plausible.io/js/pa-wM4pfvIYRQVuIgaXue7ry.js"></script>
1<script> 2 window.plausible=window.plausible||function(){(plausible.q=plausible.q||[]).push(arguments)},plausible.init=plausible.init||function(i){plausible.o=i||{}}; 3 plausible.init() 4 </script>
4<link rel="stylesheet" href="/_astro/TestimonialsSection.vGUScjdh.css"> 5<link rel="stylesheet" href="/_astro/BaseLayout.9rkPZlJE.css"> 6<link rel="stylesheet" href="/_astro/index@[email protected]"> 7<style>.sib-hide-loader-icon[data-astro-cid-y7zmneqf],.sib-form-message-panel[data-astro-cid-y7zmneqf]{display:none}.sib-form-message-panel[data-astro-cid-y7zmneqf].sib-form-message-panel--active{display:block} 8</style></head> <body class="page--home"> <div id="site-header" class="header-wrapper" data-astro-cid-qlfjksao> <header class="header relative flex w-full max-w-full items-center justify-between gap-1 max-md:justify-center max-md:gap-2 sm:gap-2 md:max-w-none mx-auto pointer-events-auto" data-astro-cid-qlfjksao> <!-- Logo pill (tablet+ â Webflow hides separate header icon below md) --> <!-- data-astro-reload: home page loads Brevo's main.js (is:inline) to wire 9 the newsletter form; ClientRouter swaps would skip that bootstrap. --> <a href="/" data-astro-reload class="pill logo-pill relative z-[2] mr-2 hidden flex-none items-center justify-center no-underline sm:mr-4 md:flex lg:mr-5" aria-label="Oursky home" data-astro-cid-qlfjksao> <img src="/images/oursky-logo.svg" alt="Oursky" width="80" height="36" class="block h-6 w-auto max-w-full object-contain sm:h-7 lg:h-8" onerror="this.style.display='none';this.nextElementSibling.style.display='block'" data-astro-cid-qlfjksao> <span class="text-lg font-bold text-black" style="display:none" data-astro-cid-qlfjksao>Oursky</span> </a> <!-- Nav: centered in remaining space <md; absolutely centered md+ (tablet + desktop). Retracts on scroll down at md+. --> <div class="header__nav-center header__nav-center--desktop relative z-[1] flex min-w-0 flex-1 justify-center px-0.5 max-md:max-w-[min(100%,26rem)] max-md:flex-none md:pointer-events-none md:absolute md:inset-x-0 md:top-1/2 md:z-[1] md:flex md:w-full md:max-w-none md:flex-none md:-translate-y-1/2 md:justify-center md:px-0" data-astro-cid-qlfjksao> <nav class="pill nav-pill flex max-w-full flex-none gap-0.5 overflow-x-auto px-1.5 py-0.5 max-md:gap-1 sm:gap-1 sm:px-1.5 sm:py-1 md:pointer-events-auto lg:gap-1 lg:px-3 lg:py-2" aria-label="Main navigation" data-astro-cid-qlfjksao> <!-- Phone: logo inside nav bar replaces Home (ref: Webflow .navbar__icon) --> <a href="/" data-astro-reload class="nav-pill__brand md:hidden mr-0.5 flex shrink-0 items-center justify-center rounded-full no-underline transition-transform duration-300 nav-pill__brand--active" aria-label="Oursky home" aria-current="page" data-astro-cid-qlfjksao> <img src="/images/oursky-logo-white.svg" alt="" width="50" height="11" class="nav-pill__brand-img pointer-events-none block h-[0.68rem] w-auto max-w-[3.4rem] object-contain" aria-hidden="true" data-astro-cid-qlfjksao> </a> <a href="/" data-astro-reload class="nav-link flex h-full shrink-0 items-center rounded-full px-1.5 py-0.5 text-xs font-medium leading-tight text-black no-underline whitespace-nowrap transition-transform duration-300 sm:px-2 sm:text-sm sm:leading-snug lg:px-3 lg:text-lg lg:leading-9 nav-link--active text-white nav-link--hide-below-md" aria-current="page" data-astro-cid-qlfjksao> Home </a><a href="/about/" class="nav-link flex h-full shrink-0 items-center rounded-full px-1.5 py-0.5 text-xs font-medium leading-tight text-black no-underline whitespace-nowrap transition-transform duration-300 sm:px-2 sm:text-sm sm:leading-snug lg:px-3 lg:text-lg lg:leading-9" data-astro-cid-qlfjksao> About </a><a href="/services/" class="nav-link flex h-full shrink-0 items-center rounded-full px-1.5 py-0.5 text-xs font-medium leading-tight text-black no-underline whitespace-nowrap transition-transform duration-300 sm:px-2 sm:text-sm sm:leading-snug lg:px-3 lg:text-lg lg:leading-9" data-astro-cid-qlfjksao> Services </a><a href="/blog/" class="nav-link flex h-full shrink-0 items-center rounded-full px-1.5 py-0.5 text-xs font-medium leading-tight text-black no-underline whitespace-nowrap transition-transform duration-300 sm:px-2 sm:text-sm sm:leading-snug lg:px-3 lg:text-lg lg:leading-9 nav-link--hide-below-md" data-astro-cid-qlfjksao> Blog </a><a href="/works/" class="nav-link flex h-full shrink-0 items-center rounded-full px-1.5 py-0.5 text-xs font-medium leading-tight text-black no-underline whitespace-nowrap transition-transform duration-300 sm:px-2 sm:text-sm sm:leading-snug lg:px-3 lg:text-lg lg:leading-9" data-astro-cid-qlfjksao> Works </a> </nav> </div> <!-- Contact: icon-only <lg; label lg+ --> <a href="/contact/" class="pill contact-pill relative z-[2] flex flex-none items-center justify-center rounded-full no-underline text-black lg:min-h-[4.25rem] lg:px-[3.125rem] lg:py-4 lg:text-lg lg:font-semibold" aria-label="Contact" data-astro-cid-qlfjksao> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 16" fill="none" class="h-3.5 w-4 shrink-0 sm:h-4 sm:w-5 lg:hidden" aria-hidden="true" data-astro-cid-qlfjksao> <path d="M2.5 2.64011C2.14844 2.64011 1.875 2.95261 1.875 3.26511V4.16354L8.59375 9.67136C9.41406 10.3354 10.5469 10.3354 11.3672 9.67136L18.125 4.16354V3.26511C18.125 2.95261 17.8125 2.64011 17.5 2.64011H2.5ZM1.875 6.58542V13.2651C1.875 13.6167 2.14844 13.8901 2.5 13.8901H17.5C17.8125 13.8901 18.125 13.6167 18.125 13.2651V6.58542L12.5781 11.
91167C11.0547 12.3667 8.90625 12.3667 7.42188 11.1167L1.875 6.58542ZM0 3.26511C0 1.89792 1.09375 0.765106 2.5 0.765106H17.5C18.8672 0.765106 20 1.89792 20 3.26511V13.2651C20 14.6714 18.8672 15.7651 17.5 15.7651H2.5C1.09375 15.7651 0 14.6714 0 13.2651V3.26511Z" fill="currentColor" data-astro-cid-qlfjksao></path> </svg> <span class="hidden lg:inline" data-astro-cid-qlfjksao>Contact</span> </a> </header> </div>
9<script type="module">(()=>{const s=document.getElementById("site-header");if(!(s instanceof HTMLElement))return;const r=s.querySelector(".header__nav-center--desktop");if(!(r instanceof HTMLElement))return;const l=s,c=r,o=window.matchMedia("(min-width: 768px)"),a=window.matchMedia("(prefers-reduced-motion: reduce)");let n=window.scrollY;const h=10,f=6,u=40;function t(e){l.classList.toggle("site-header--nav-retracted",e),e?c.setAttribute("aria-hidden","true"):c.removeAttribute("aria-hidden")}function i(){if(!o.matches||a.matches){t(!1),n=window.scrollY;return}const e=window.scrollY;e<=u?t(!1):e>n+h?t(!0):e<n-f&&t(!1),n=e}function d(){(!o.matches||a.matches)&&t(!1)}window.addEventListener("scroll",i,{passive:!0}),o.addEventListener("change",d),a.addEventListener("change",d),i()})();</script>
9 <main class="min-w-0 max-w-full"> <div class="home-page min-w-0 overflow-x-clip"> <!-- 10 Wraps hero + intro: light gray background, max-width 1360px, centered. 11 The hero card (border-radius 48px) fills the rail content box. 12 --> <div class="bg-bg flex flex-col items-stretch w-full max-w-[var(--home-rail-max)] mx-auto pt-4 px-[var(--home-rail-gutter)] gap-0 overflow-visible box-border lg:pt-10 max-md:max-w-none max-md:p-0"> <!-- Mirrors Webflow .hero-banner-static: light beige card, video at bottom, gradient headline --><div class="hero-banner-static flex flex-col justify-start items-stretch w-full relative overflow-hidden bg-hero-beige-light rounded-xl" data-astro-cid-wse7a2hg> <!-- Caption: gradient headline + subtitle (site header overlays this card on home) --> <div class="hero-caption z-[5] w-full max-w-[90%] relative text-center mx-auto max-md:max-w-[95%]" data-astro-cid-wse7a2hg> <!-- Gradient text requires -webkit-background-clip which stays in CSS --> <h1 class="hero-h1 font-[Borna,sans-serif] font-medium mb-0" data-astro-cid-wse7a2hg> 13Build it right<br data-astro-cid-wse7a2hg>the First Time 14</h1> <p class="hero-subtitle font-[Borna,sans-serif] font-normal text-black mb-0 md:mb-8" data-astro-cid-wse7a2hg> 15Engineering Excellence is the<br data-astro-cid-wse7a2hg>baseline here. 16</p> </div> <!-- Video block anchored to bottom of hero --> <div class="absolute inset-0 z-0 bg-hero-beige w-full h-full overflow-hidden" aria-hidden="true" data-astro-cid-wse7a2hg> <div id="hero-parallax-layer" class="absolute inset-auto left-0 right-0 bottom-0 w-full" data-astro-cid-wse7a2hg> <div class="hero-video-root relative z-0 w-full overflow-hidden" data-astro-cid-wse7a2hg> <video class="absolute inset-0 w-full h-full object-cover object-center block" autoplay loop muted playsinline poster="/videos/202604091506-6_poster.0000000.jpg" data-astro-cid-wse7a2hg> <source src="/videos/202604091506-6_mp4.mp4" type="video/mp4" data-astro-cid-wse7a2hg> <source src="/videos/202604091506-6_webm.webm" type="video/webm" data-astro-cid-wse7a2hg> </video> </div> <!-- Gradient fade from beige into transparent, overlapping the video top edge --> <div class="hero-gradient absolute w-full pointer-events-none z-[1]" aria-hidden="true" data-astro-cid-wse7a2hg></div> </div> </div> </div>
16<script type="module">(function(){if(window.matchMedia("(prefers-reduced-motion: reduce)").matches)return;const t=document.getElementById("hero-parallax-layer");if(!t)return;const r=.35;let e=0;function n(){t.style.transform=`translateY(${window.scrollY*r}px)`,e=0}window.addEventListener("scroll",()=>{e||(e=requestAnimationFrame(n))},{passive:!0})})();</script>
16 <section class="intro-section-home scroll-reveal-group flex w-full flex-col items-start gap-10 bg-bg text-xl-plus leading-10 box-border mt-section-lg mb-section-lg px-10 max-md:mt-10 max-md:mb-14 max-md:px-[var(--home-rail-gutter)] max-md:text-lg max-md:leading-7 lg:flex-row lg:flex-wrap lg:items-center lg:justify-between" aria-label="Introduction"> <img src="/images/os-w-1-2.svg" loading="lazy" alt="" aria-hidden="true" class="scroll-reveal-item max-w-[320px] shrink-0 max-lg:max-w-[200px] max-md:max-w-[140px]" style="--sr-delay: 0ms"> <p class="scroll-reveal-item mb-0 w-full lg:flex-1" style="--sr-delay: 75ms"> <span class="font-semibold">Welcome to Oursky</span> <span class="inline max-md:hidden"> â¯â¯â¯â¯â¯ </span> <span class="hidden max-md:inline"> â¯â¯â¯ </span>Across Hong Kong, London, Taipei, Tokyo, and Canada, our talented and 17 close-knit team of developers, designers, and product managers is driven 18 to help you craft the unique experience with excellent user experiences 19 and cutting-edge technologies. 20</p> <span class="scroll-reveal-item shrink-0" style="--sr-delay: 150ms"> <a href="/about/" class="inline-flex items-center justify-center whitespace-nowrap no-underline cursor-pointer rounded-full transition-all duration-300 h-[4.25rem] px-[3.125rem] text-lg font-medium border-[1.5px] border-black text-black bg-transparent hover:bg-black hover:text-white">Meet The Team</a> </span> </section> </div> <!-- Our Works card --> <div class="w-full max-w-[var(--home-rail-max)] mx-auto px-[var(--home-rail-gutter)] max-md:px-0"> <div class="rounded-xl max-md:rounded-lg overflow-hidden"> <section class="works-section scroll-reveal-group w-full min-h-[640px] max-lg:min-h-[860px] max-md:min-h-[840px] py-28 pb-section-lg max-md:py-16 max-md:pb-20" aria-labelledby="works-heading" data-astro-cid-udilncuk> <div class="flex justify-center items-center w-full max-w-[1360px] mx-auto px-10 box-border max-lg:flex-col max-lg:gap-8 max-md:px-[var(--home-rail-gutter)]" data-astro-cid-udilncuk> <!-- Text column --> <div class="flex flex-col justify-center items-start w-1/2 max-lg:w-full" data-astro-cid-udilncuk> <h2 id="works-heading" class="scroll-reveal-item text-white text-3xl font-semibold leading-[3.5rem] mb-4" style="--sr-delay: 0ms" data-astro-cid-udilncuk> 21Our Works 22</h2> <p class="scroll-reveal-item text-white text-[1.6rem] font-normal leading-8 mb-6 max-md:text-lg max-md:leading-[1.65rem]" style="--sr-delay: 70ms" data-astro-cid-udilncuk> 23We develop and design mobile and web apps, or native softwares for our clients, 24 from Apple App of the Years startups to NASDAQ listed enterprises. 25</p> <a href="/works/" class="inline-flex items-center justify-center whitespace-nowrap no-underline cursor-pointer rounded-full transition-all duration-300 h-[4.25rem] px-[3.125rem] text-lg font-medium border-[1.5px] border-white/85 text-white bg-transparent hover:bg-white/15 scroll-reveal-item my-2.5">View Our Works</a> </div> <!-- Right spacer: keeps text pinned left on desktop, hidden on tablet/mobile --> <div class="w-1/2 max-lg:hidden" aria-hidden="true" data-astro-cid-udilncuk></div> </div> <!-- Phone group: always absolute bottom-right, bleeds off right + bottom edges --> <div class="works-cardwrap" aria-hidden="true" data-astro-cid-udilncuk> <img class="works-card works-card--1" src="/images/swrm-preview-phone.webp" alt="" loading="lazy" data-astro-cid-udilncuk> <img class="works-card works-card--2" src="/images/pl-preview-phone.webp" alt="" loading="lazy" data-astro-cid-udilncuk> <img class="works-card works-card--3" src="/images/jp-preview-phone.webp" alt="" loading="lazy" data-astro-cid-udilncuk> </div> </section>
25<script type="module">(function(){if(window.matchMedia("(prefers-reduced-motion: reduce)").matches)return;const e=document.querySelector(".works-section"),n=e?.querySelector(".works-cardwrap");if(!e||!n)return;const c=.12;let t=0;function r(){const o=e.getBoundingClientRect(),i=(window.innerHeight/2-(o.top+o.height/2))*c;n.style.transform=`translateY(${-i}px)`,t=0}window.addEventListener("scroll",()=>{t||(t=requestAnimationFrame(r))},{passive:!0}),r()})();</script>
25 </div> </div> <!-- Our Products full-width (no card) --> <!-- Background gradient + SVG wireframe pattern must stay in CSS --><section class="products-section scroll-reveal-group flex flex-col justify-start items-center self-center w-full" aria-labelledby="products-heading" data-astro-cid-bwdofi3o> <div class="flex flex-col justify-start items-center w-full max-w-[1360px] mx-auto box-border px-10 pb-[200px] max-md:px-5 max-md:pb-[160px]" data-astro-cid-bwdofi3o> <section class="flex flex-col items-center mt-section-lg max-md:mt-section w-full" data-astro-cid-bwdofi3o> <h2 id="products-heading" class="scroll-reveal-item text-black text-3xl font-semibold leading-[3.5rem] mb-4 max-md:mb-8" style="--sr-delay: 0ms" data-astro-cid-bwdofi3o> 26Our Products 27</h2> <div class="flex flex-row justify-center items-stretch gap-5 w-full max-md:flex-col max-md:items-center max-md:gap-12" data-astro-cid-bwdofi3o> <a href="https://formx.ai" target="_blank" rel="noopener noreferrer" class="product-card flex flex-col flex-1 justify-between items-center mt-12 no-underline text-black max-md:mt-0" data-astro-cid-bwdofi3o> <div class="flex flex-col justify-start items-center" data-astro-cid-bwdofi3o> <img src="/images/fx-icon.webp" alt="FormX" loading="lazy" class="scroll-reveal-item w-[260px] block max-md:w-[180px]" style="--sr-delay: 70ms" data-astro-cid-bwdofi3o> <h3 class="scroll-reveal-item text-2xl font-semibold leading-[42px] mt-2 mb-1" style="--sr-delay: 110ms" data-astro-cid-bwdofi3o> FormX </h3> <p class="scroll-reveal-item text-center text-lg font-normal leading-8 m-0" style="--sr-delay: 150ms" data-astro-cid-bwdofi3o> Automate Document Workflow<br data-astro-cid-bwdofi3o>with AI Agents </p> </div> </a><a href="https://authgear.com" target="_blank" rel="noopener noreferrer" class="product-card flex flex-col flex-1 justify-between items-center mt-12 no-underline text-black max-md:mt-0" data-astro-cid-bwdofi3o> <div class="flex flex-col justify-start items-center" data-astro-cid-bwdofi3o> <img src="/images/authgear-icon.webp" alt="Authgear" loading="lazy" class="scroll-reveal-item w-[260px] block max-md:w-[180px]" style="--sr-delay: 210ms" data-astro-cid-bwdofi3o> <h3 class="scroll-reveal-item text-2xl font-semibold leading-[42px] mt-2 mb-1" style="--sr-delay: 250ms" data-astro-cid-bwdofi3o> Authgear </h3> <p class="scroll-reveal-item text-center text-lg font-normal leading-8 m-0" style="--sr-delay: 290ms" data-astro-cid-bwdofi3o> Secure Single Sign On for<br data-astro-cid-bwdofi3o>Frontline Workers & Customers </p> </div> </a> </div> </section> </div> </section> <!-- Trusted Clients card â negative margin overlaps the Products bg pattern --> <div class="relative z-10 w-full max-w-[var(--home-rail-max)] mx-auto px-[var(--home-rail-gutter)] -mt-20 max-md:-mt-10 max-md:px-0"> <div class="rounded-xl max-md:rounded-lg overflow-hidden"> <section class="scroll-reveal-group bg-logos-dark w-full min-h-[300px] py-28 overflow-hidden max-md:py-16 max-md:pb-20" aria-labelledby="clients-heading"> <div class="flex justify-center items-center w-full max-w-[1360px] mx-auto px-16 box-border max-md:px-8"> <div class="flex flex-col justify-center items-center w-full"> <h2 id="clients-heading" class="scroll-reveal-item text-white text-[1.8rem] font-medium leading-8 mb-4 text-center" style="--sr-delay: 0ms"> 28Trusted by Leading Brands 29</h2> <div class="grid grid-cols-4 gap-[60px] place-items-center w-full mt-12 mb-12 max-md:grid-cols-2 max-md:gap-8"> <img src="/images/swire.png" srcset="/images/swire-p-500.png 500w, /images/swire.png 1667w" sizes="(max-width: 1023px) 50vw, 25vw" alt="Swire" loading="lazy" class="scroll-reveal-item object-contain w-full max-h-20 py-2.5 opacity-75 max-md:max-h-[50px]" style="--sr-delay: 40ms"><img src="/images/mtr.png" srcset="/images/mtr-p-500.png 500w, /images/mtr.png 1044w" sizes="(max-width: 1023px) 50vw, 25vw" alt="MTR" loading="lazy" class="scroll-reveal-item object-contain w-full max-h-20 py-2.5 opacity-75 max-md:max-h-[50px] brightness-0 invert" style="--sr-delay: 68ms"><img src="/images/welab.png" sizes="(max-width: 1023px) 50vw, 25vw" alt="WeLab" loading="lazy" class="scroll-reveal-item object-contain w-full max-h-20 py-2.5 opacity-75 max-md:max-h-[50px] brightness-0 invert" style="--sr-delay: 96ms"><img src="/images/asos.png" srcset="/images/asos-p-500.png 500w, /images/asos.png 3428w" sizes="(max-width: 1023px) 50vw, 25vw" alt="ASOS" loading="lazy" class="scroll-reveal-item object-contain w-full max-h-20 py-2.5 opacity-75 max-md:max-h-[50px] brightness-0 invert" style="--sr-delay: 124ms"><img src="/images/axiata.png" sizes="(max-width: 1023px) 50vw, 25vw" alt="Axiata" loading="lazy" class="scroll-reveal-item object-contain w-full max-h-20 py-2.5 opacity-75 max-md:max-h-[50px] brightness-0 invert" style="--sr-delay: 152ms"><img src="/images/pp.png" sizes="(max-width: 1023px) 50vw, 25vw" alt="Pacific Place" loading="lazy" class="scroll-reveal-item object-contain w-full max-h-20 py-2.5 opacity-75 max-md:max-h-[50px] brightness-0 invert" style="--sr-delay: 180ms"><img src="/images/Socket_Mobile_Logo-1536x572.png" srcset="/images/Socket_Mobile_Logo-1536x572-p-500.png 500w, /images/Socket_Mobile_Logo-1536x572.png 1536w" sizes="(max-width: 1023px) 50vw, 25vw" alt="Socket Mobile" loading="lazy" class="scroll-reveal-item object-contain w-full max-h-20 py-2.5 opacity-75 max-md:max-h-[50px] brightness-0 invert" style="--sr-delay: 208ms"><img src="/images/reuters.png" srcset="/images/reuters-p-500.png 500w, /images/reuters.png 754w" sizes="(max-width: 1023px) 50vw, 25vw" alt="Reuters" loading="lazy" class="scroll-reveal-item object-contain w-full max-h-20 py-2.5 opacity-75 max-md:max-h-[50px] brightness-0 invert" style="--sr-delay: 236ms"><img src="/images/tatacommunicationslogo-1024x205.png" srcset="/images/tatacommunicationslogo-1024x205-p-500.png 500w, /images/tatacommunicationslogo-1024x205.png 1024w" sizes="(max-width: 1023px) 50vw, 25vw" alt="Tata Communications" loading="lazy" class="scroll-reveal-item object-contain w-full max-h-20 py-2.5 opacity-75 max-md:max-h-[50px] brightness-0 invert" style="--sr-delay: 264ms"><img src="/images/hktdc.png" srcset="/images/hktdc-p-500.png 500w, /images/hktdc.png 874w" sizes="(max-width: 1023px) 50vw, 25vw" alt="HKTDC" loading="lazy" class="scroll-reveal-item object-contain w-full max-h-20 py-2.5 opacity-75 max-md:max-h-[50px] brightness-0 invert" style="--sr-delay: 292ms"><img src="/images/milwaukee.png" srcset="/images/milwaukee-p-500.png 500w, /images/milwaukee.png 1914w" sizes="(max-width: 1023px) 50vw, 25vw" alt="Milwaukee" loading="lazy" class="scroll-reveal-item object-contain w-full max-h-20 py-2.5 opacity-75 max-md:max-h-[50px] brightness-0 invert" style="--sr-delay: 320ms"><img src="/images/sc.png" srcset="/images/sc-p-500.png 500w, /images/sc.png 1250w" sizes="(max-width: 1023px) 50vw, 25vw" alt="Standard Chartered" loading="lazy" class="scroll-reveal-item object-contain w-full max-h-20 py-2.5 opacity-75 max-md:max-h-[50px] brightness-0 invert" style="--sr-delay: 348ms"><img src="/images/philips.svg.png" srcset="/images/philips.svg-p-500.png 500w, /images/philips.svg.png 1680w" sizes="(max-width: 1023px) 50vw, 25vw" alt="Philips" loading="lazy" class="scroll-reveal-item object-contain w-full max-h-20 py-2.5 opacity-75 max-md:max-h-[50px] brightness-0 invert" style="--sr-delay: 348ms"><img src="/images/likecoin.png" srcset="/images/likecoin-p-500.png 500w, /images/likecoin.png 986w" sizes="(max-width: 1023px) 50vw, 25vw" alt="LikeCoin" loading="lazy" class="scroll-reveal-item object-contain w-full max-h-20 py-2.5 opacity-75 max-md:max-h-[50px] brightness-0 invert" style="--sr-delay: 348ms"><img src="/images/k11.png" srcset="/images/k11-p-500.png 500w, /images/k11.png 752w" sizes="(max-width: 1023px) 50vw, 25vw" alt="K11" loading="lazy" class="scroll-reveal-item object-contain w-full max-h-20 py-2.5 opacity-75 max-md:max-h-[50px] brightness-0 invert" style="--sr-delay: 348ms"> </div> </div> </div> </section> </div> </div> <section class="scroll-reveal-group flex flex-col justify-center items-start w-full overflow-hidden" aria-label="Testimonials" data-astro-cid-wwptblld> <div class="w-full max-w-[var(--home-rail-max)] mx-auto px-[var(--home-rail-gutter)] box-border mt-section mb-section pt-section relative block max-lg:mt-10 max-lg:pt-6" data-astro-cid-wwptblld> <div class="testimonials-swiper swiper" data-astro-cid-wwptblld> <div class="swiper-wrapper" data-astro-cid-wwptblld> <article class="swiper-slide testimonial-slide" data-astro-cid-wwptblld> <div class="bg-surface rounded-lg p-6 h-full flex flex-col gap-0 shadow-[0_2px_12px_rgba(0,0,0,0.06)]" data-astro-cid-wwptblld> <div class="rounded-full shrink-0 w-24 h-24 overflow-hidden mb-2" data-astro-cid-wwptblld> <img src="/images/1616016767594.jpeg" alt="Chris Toy" loading="lazy" class="rounded-full w-full h-full object-cover block" data-astro-cid-wwptblld> </div> <div class="flex flex-col flex-1" data-astro-cid-wwptblld> <blockquote class="border-l-0 mb-0 pt-5 text-base italic font-normal leading-snug flex-1" data-astro-cid-wwptblld> "We worked with Oursky on multiple MVPs of our idea and and iterated product through our multi-million venture capital raise. Great job in handling backend refactoring and scalability. Seamless communication (we're in SF). Making HK proud." </blockquote> <p class="mt-9 mb-0 text-xs font-black leading-[1.2rem]" data-astro-cid-wwptblld> <a href="https://www.linkedin.com/in/christoy" target="_blank" rel="noopener noreferrer" class="text-text underline hover:opacity-60" data-astro-cid-wwptblld> Chris Toy </a> , Founder of Bindle and MarketerHire </p> </div> </div> </article><article class="swiper-slide testimonial-slide" data-astro-cid-wwptblld> <div class="bg-surface rounded-lg p-6 h-full flex flex-col gap-0 shadow-[0_2px_12px_rgba(0,0,0,0.06)]" data-astro-cid-wwptblld> <div class="rounded-full shrink-0 w-24 h-24 overflow-hidden mb-2" data-astro-cid-wwptblld> <img src="/images/club-app-icon-round-corner.webp" alt="Joel Tse" loading="lazy" class="rounded-full w-full h-full object-cover block" data-astro-cid-wwptblld> </div> <div class="flex flex-col flex-1" data-astro-cid-wwptblld> <blockquote class="border-l-0 mb-0 pt-5 text-base italic font-normal leading-snug flex-1" data-astro-cid-wwptblld> "I partnered with Oursky for our mobile app development and were impressed by their high-quality delivery. Their team provided expert advice and was highly responsible, consistently meeting deadlines with clear communication. I highly recommend Oursky for their professionalism and commitment to client satisfaction." </blockquote> <p class="mt-9 mb-0 text-xs font-black leading-[1.2rem]" data-astro-cid-wwptblld> <a href="https://hk.linkedin.com/in/joel-tse-hk" target="_blank" rel="noopener noreferrer" class="text-text underline hover:opacity-60" data-astro-cid-wwptblld> Joel Tse </a> , Senior Product Manager, Club HKT </p> </div> </div> </article><article class="swiper-slide testimonial-slide" data-astro-cid-wwptblld> <div class="bg-surface rounded-lg p-6 h-full flex flex-col gap-0 shadow-[0_2px_12px_rgba(0,0,0,0.06)]" data-astro-cid-wwptblld> <div class="rounded-full shrink-0 w-24 h-24 overflow-hidden mb-2" data-astro-cid-wwptblld> <img src="/images/hugh-bell.webp" alt="Hugh Bell" loading="lazy" class="rounded-full w-full h-full object-cover block" data-astro-cid-wwptblld> </div> <div class="flex flex-col flex-1" data-astro-cid-wwptblld> <blockquote class="border-l-0 mb-0 pt-5 text-base italic font-normal leading-snug flex-1" data-astro-cid-wwptblld> "Simply the best dev shop I have worked with. No need to fly to Silicon Valley, when SV knowledge & approach is right here in Oursky" </blockquote> <p class="mt-9 mb-0 text-xs font-black leading-[1.2rem]" data-astro-cid-wwptblld> <a href="https://www.linkedin.com/in/christoy" target="_blank" rel="noopener noreferrer" class="text-text underline hover:opacity-60" data-astro-cid-wwptblld> Hugh Bell, Founder of Cococolors </a> </p> </div> </div> </article><article class="swiper-slide testimonial-slide" data-astro-cid-wwptblld> <div class="bg-surface rounded-lg p-6 h-full flex flex-col gap-0 shadow-[0_2px_12px_rgba(0,0,0,0.06)]" data-astro-cid-wwptblld> <div class="rounded-full shrink-0 w-24 h-24 overflow-hidden mb-2" data-astro-cid-wwptblld> <img src="/images/Becky-Pate.webp" alt="Becky Pate" loading="lazy" class="rounded-full w-full h-full object-cover block" data-astro-cid-wwptblld> </div> <div class="flex flex-col flex-1" data-astro-cid-wwptblld> <blockquote class="border-l-0 mb-0 pt-5 text-base italic font-normal leading-snug flex-1" data-astro-cid-wwptblld> "Oursky has been great to work with. They provided accurate estimates on the work required and always delivered on time despite the time difference and location. The cross-team communication was always effective. Their organized approach to the product development and on-hand support when issues arose were brilliant and I'd definitely recommend and work with them again." </blockquote> <p class="mt-9 mb-0 text-xs font-black leading-[1.2rem]" data-astro-cid-wwptblld> <a href="https://www.linkedin.com/in/christoy" target="_blank" rel="noopener noreferrer" class="text-text underline hover:opacity-60" data-astro-cid-wwptblld> Becky Pate, Senior Product Manager, ASOS </a> </p> </div> </div> </article><article class="swiper-slide testimonial-slide" data-astro-cid-wwptblld> <div class="bg-surface rounded-lg p-6 h-full flex flex-col gap-0 shadow-[0_2px_12px_rgba(0,0,0,0.06)]" data-astro-cid-wwptblld> <div class="rounded-full shrink-0 w-24 h-24 overflow-hidden mb-2" data-astro-cid-wwptblld> <img src="/images/PhoebePoon.JPG" alt="Phoebe Poon" loading="lazy" class="rounded-full w-full h-full object-cover block" data-astro-cid-wwptblld> </div> <div class="flex flex-col flex-1" data-astro-cid-wwptblld> <blockquote class="border-l-0 mb-0 pt-5 text-base italic font-normal leading-snug flex-1" data-astro-cid-wwptblld> "I had the pleasure of working with Oursky. Oursky's team provided valuable insights and recommendations for our blockchain module, and their expertise was evident in the high-quality work they delivered. They went above and beyond to ensure our project's success." </blockquote> <p class="mt-9 mb-0 text-xs font-black leading-[1.2rem]" data-astro-cid-wwptblld> <a href="https://www.linkedin.com/in/christoy" target="_blank" rel="noopener noreferrer" class="text-text underline hover:opacity-60" data-astro-cid-wwptblld> Phoebe Poon, Co-founder & CEO of Liker Land </a> </p> </div> </div> </article> </div> </div> </div> </section>
29<script type="module" src="/_astro/TestimonialsSection.astro_astro_type_script_index_0_lang.CTTRK7qU.js"></script>
29 <!-- 30 Last section: light gray (#f7f7f7) rounded-top section containing 31 the blog scroll, action cards, and contact form. 32 --> <section class="bg-bg rounded-t-[40px] flex flex-col justify-center items-center w-full overflow-hidden p-0"> <div class="w-full max-w-[var(--home-rail-max)] mx-auto box-border"> <div class="scroll-reveal-group w-full" data-astro-cid-3fbjgh3j> <div class="scroll-reveal-item flex items-center justify-between px-[var(--home-rail-gutter)] pt-10 pb-4 w-full max-md:px-5 max-md:pt-8 max-md:pb-3" style="--sr-delay: 0ms" data-astro-cid-3fbjgh3j> <span class="inline-flex items-center py-1.5 px-4 rounded-full text-xs font-bold tracking-[0.05em] uppercase no-underline whitespace-nowrap bg-black/[.08] text-text">Blog</span> <a href="/blog/" class="inline-flex items-center py-1.5 px-4 rounded-full text-xs font-bold tracking-[0.05em] uppercase no-underline whitespace-nowrap bg-transparent text-text-muted font-medium normal-case tracking-normal transition-opacity hover:opacity-70 hover:opacity-70">View All â</a> </div> <section class="blog-section relative pb-10 max-md:pb-8" aria-label="oursky blogs" data-astro-cid-3fbjgh3j> <div class="blog-scroll-wrapper" data-astro-cid-3fbjgh3j> <ul class="blog-card-list flex gap-6 overflow-x-auto overflow-y-visible snap-x [scrollbar-width:none] list-none py-2 pb-4 m-0" role="list" data-astro-cid-3fbjgh3j> <li class="scroll-reveal-item snap-start shrink-0 grow-0 basis-[34.5rem] w-[34.5rem] min-w-[34.5rem] flex max-lg:basis-[26rem] max-lg:w-[26rem] max-lg:min-w-[26rem] max-md:w-72 max-md:min-w-72 max-md:basis-72" style="--sr-delay: 45ms" data-astro-cid-3fbjgh3j> <article class="w-full bg-surface border border-[#E0E9EC] rounded-[20px] overflow-hidden transition-shadow hover:shadow-[0_2px_5px_rgba(0,0,0,0.1)] flex flex-col h-full"> <a href="/blogs/the-new-era-of-e2e-test-automation-faster-cheaper-and-more-accessible/" class="group flex flex-col gap-4 no-underline p-10 pb-0 max-md:p-4 max-md:pb-0 max-md:gap-3"> <h3 class="text-base font-medium text-black uppercase tracking-[0.02em] leading-[38px] truncate m-0 max-md:text-sm max-md:leading-6"> Test Automation </h3> <div class="w-full h-[17.5rem] overflow-hidden rounded-md bg-muted max-md:h-44"> <img src="/images/blogs/6590ffe387_66e7b17a8935e3e5cd466add_cover_img.webp" alt="The New Era of E2E Test Automation: Faster, Cheaper, and More Accessible" class="w-full h-full object-cover block transition-transform duration-300 group-hover:scale-[1.04]" loading="lazy" width="560" height="280"> </div> <h2 class="text-xl-plus font-normal text-black leading-[34px] m-0 line-clamp-3 min-h-[102px] group-hover:text-primary max-md:text-xl max-md:leading-7 max-md:min-h-[84px]"> The New Era of E2E Test Automation: Faster, Cheaper, and More Accessible </h2> </a> <div class="mt-auto flex flex-wrap items-center gap-1.5 px-10 pt-5 pb-10 max-md:px-4 max-md:pt-3 max-md:pb-5"> <a href="/blog-category/qa/" class="inline-flex items-center h-9 px-2.5 bg-muted text-sm font-semibold text-black tracking-[0.02em] whitespace-nowrap no-underline transition-colors hover:bg-accent"> QA </a><a href="/blog-category/machine-learning-and-ai/" class="inline-flex items-center h-9 px-2.5 bg-muted text-sm font-semibold text-black tracking-[0.02em] whitespace-nowrap no-underline transition-colors hover:bg-accent"> Machine learning and AI </a> </div> </article> </li><li class="scroll-reveal-item snap-start shrink-0 grow-0 basis-[34.5rem] w-[34.5rem] min-w-[34.5rem] flex max-lg:basis-[26rem] max-lg:w-[26rem] max-lg:min-w-[26rem] max-md:w-72 max-md:min-w-72 max-md:basis-72" style="--sr-delay: 93ms" data-astro-cid-3fbjgh3j> <article class="w-full bg-surface border border-[#E0E9EC] rounded-[20px] overflow-hidden transition-shadow hover:shadow-[0_2px_5px_rgba(0,0,0,0.1)] flex flex-col h-full"> <a href="/blogs/10-best-ai-coding-assistant-tools---2024/" class="group flex flex-col gap-4 no-underline p-10 pb-0 max-md:p-4 max-md:pb-0 max-md:gap-3"> <h3 class="text-base font-medium text-black uppercase tracking-[0.02em] leading-[38px] truncate m-0 max-md:text-sm max-md:leading-6"> AI and Machine Learning </h3> <div class="w-full h-[17.5rem] overflow-hidden rounded-md bg-muted max-md:h-44"> <img src="/images/blogs/b951f9150c_66e3fc0e1ff91c70fd6eafbe_deep-learning-ai-empowering-businesses-with-intel-2023-11-27-04-58-50-utc.webp" alt="10 Best AI Coding Assistant Tools - 2024" class="w-full h-full object-cover block transition-transform duration-300 group-hover:scale-[1.04]" loading="lazy" width="560" height="280"> </div> <h2 class="text-xl-plus font-normal text-black leading-[34px] m-0 line-clamp-3 min-h-[102px] group-hover:text-primary max-md:text-xl max-md:leading-7 max-md:min-h-[84px]"> 10 Best AI Coding Assistant Tools - 2024 </h2> </a> <div class="mt-auto flex flex-wrap items-center gap-1.5 px-10 pt-5 pb-10 max-md:px-4 max-md:pt-3 max-md:pb-5"> <a href="/blog-category/machine-learning-and-ai/" class="inline-flex items-center h-9 px-2.5 bg-muted text-sm font-semibold text-black tracking-[0.02em] whitespace-nowrap no-underline transition-colors hover:bg-accent"> Machine learning and AI </a><a href="/blog-category/development/" class="inline-flex items-center h-9 px-2.5 bg-muted text-sm font-semibold text-black tracking-[0.02em] whitespace-nowrap no-underline transition-colors hover:bg-accent"> Development </a> </div> </article> </li><li class="scroll-reveal-item snap-start shrink-0 grow-0 basis-[34.5rem] w-[34.5rem] min-w-[34.5rem] flex max-lg:basis-[26rem] max-lg:w-[26rem] max-lg:min-w-[26rem] max-md:w-72 max-md:min-w-72 max-md:basis-72" style="--sr-delay: 141ms" data-astro-cid-3fbjgh3j>
32 <article class="w-full bg-surface border border-[#E0E9EC] rounded-[20px] overflow-hidden transition-shadow hover:shadow-[0_2px_5px_rgba(0,0,0,0.1)] flex flex-col h-full"> <a href="/blogs/5-questions-to-ask-agencies-before-outsourcing-software-development/" class="group flex flex-col gap-4 no-underline p-10 pb-0 max-md:p-4 max-md:pb-0 max-md:gap-3"> <h3 class="text-base font-medium text-black uppercase tracking-[0.02em] leading-[38px] truncate m-0 max-md:text-sm max-md:leading-6"> GUIDES FOR OUTSOURCING </h3> <div class="w-full h-[17.5rem] overflow-hidden rounded-md bg-muted max-md:h-44"> <img src="/images/blogs/59c10773fe_658006431e8318870c77ab3c_Outsourcing.webp" alt="5 Questions to Ask Agencies Before Outsourcing Software Development" class="w-full h-full object-cover block transition-transform duration-300 group-hover:scale-[1.04]" loading="lazy" width="560" height="280"> </div> <h2 class="text-xl-plus font-normal text-black leading-[34px] m-0 line-clamp-3 min-h-[102px] group-hover:text-primary max-md:text-xl max-md:leading-7 max-md:min-h-[84px]">
32 5 Questions to Ask Agencies Before Outsourcing Software Development </h2> </a> <div class="mt-auto flex flex-wrap items-center gap-1.5 px-10 pt-5 pb-10 max-md:px-4 max-md:pt-3 max-md:pb-5"> <a href="/blog-category/ui-design/" class="inline-flex items-center h-9 px-2.5 bg-muted text-sm font-semibold text-black tracking-[0.02em] whitespace-nowrap no-underline transition-colors hover:bg-accent"> UI Design </a><a href="/blog-category/development/" class="inline-flex items-center h-9 px-2.5 bg-muted text-sm font-semibold text-black tracking-[0.02em] whitespace-nowrap no-underline transition-colors hover:bg-accent"> Development </a> </div> </article> </li><li class="scroll-reveal-item snap-start shrink-0 grow-0 basis-[34.5rem] w-[34.5rem] min-w-[34.5rem] flex max-lg:basis-[26rem] max-lg:w-[26rem] max-lg:min-w-[26rem] max-md:w-72 max-md:min-w-72 max-md:basis-72" style="--sr-delay: 189ms" data-astro-cid-3fbjgh3j> <article class="w-full bg-surface border border-[#E0E9EC] rounded-[20px] overflow-hidden transition-shadow hover:shadow-[0_2px_5px_rgba(0,0,0,0.1)] flex flex-col h-full"> <a href="/blogs/client-case-study-applying-machine-learning-to-nba-predictions/" class="group flex flex-col gap-4 no-underline p-10 pb-0 max-md:p-4 max-md:pb-0 max-md:gap-3"> <h3 class="text-base font-medium text-black uppercase tracking-[0.02em] leading-[38px] truncate m-0 max-md:text-sm max-md:leading-6"> MACHINE LEARNING AND AI </h3> <div class="w-full h-[17.5rem] overflow-hidden rounded-md bg-muted max-md:h-44"> <img src="/images/blogs/9e1b162f5a_658006d15b17e17950efdbe9_case-study-nba.webp" alt="Client Case Study: Applying Machine Learning to NBA Predictions" class="w-full h-full object-cover block transition-transform duration-300 group-hover:scale-[1.04]" loading="lazy" width="560" height="280"> </div> <h2 class="text-xl-plus font-normal text-black leading-[34px] m-0 line-clamp-3 min-h-[102px] group-hover:text-primary max-md:text-xl max-md:leading-7 max-md:min-h-[84px]"> Client Case Study: Applying Machine Learning to NBA Predictions </h2> </a> <div class="mt-auto flex flex-wrap items-center gap-1.5 px-10 pt-5 pb-10 max-md:px-4 max-md:pt-3 max-md:pb-5"> <a href="/blog-category/machine-learning-and-ai/" class="inline-flex items-center h-9 px-2.5 bg-muted text-sm font-semibold text-black tracking-[0.02em] whitespace-nowrap no-underline transition-colors hover:bg-accent"> Machine learning and AI </a> </div> </article> </li><li class="scroll-reveal-item snap-start shrink-0 grow-0 basis-[34.5rem] w-[34.5rem] min-w-[34.5rem] flex max-lg:basis-[26rem] max-lg:w-[26rem] max-lg:min-w-[26rem] max-md:w-72 max-md:min-w-72 max-md:basis-72" style="--sr-delay: 237ms" data-astro-cid-3fbjgh3j> <article class="w-full bg-surface border border-[#E0E9EC] rounded-[20px] overflow-hidden transition-shadow hover:shadow-[0_2px_5px_rgba(0,0,0,0.1)] flex flex-col h-full"> <a href="/blogs/the-power-of-design-components-and-systems-benefits-and-best-practices/" class="group flex flex-col gap-4 no-underline p-10 pb-0 max-md:p-4 max-md:pb-0 max-md:gap-3"> <h3 class="text-base font-medium text-black uppercase tracking-[0.02em] leading-[38px] truncate m-0 max-md:text-sm max-md:leading-6"> Design </h3> <div class="w-full h-[17.5rem] overflow-hidden rounded-md bg-muted max-md:h-44"> <img src="/images/blogs/22da8697a5_66e158007ee515828c668f29_ux-developer-and-ui-designer-brainstorming-2024-08-27-16-11-36-utc.webp" alt="The Power of Design Components and Systems: Benefits and Best Practices" class="w-full h-full object-cover block transition-transform duration-300 group-hover:scale-[1.04]" loading="lazy" width="560" height="280"> </div> <h2 class="text-xl-plus font-normal text-black leading-[34px] m-0 line-clamp-3 min-h-[102px] group-hover:text-primary max-md:text-xl max-md:leading-7 max-md:min-h-[84px]"> The Power of Design Components and Systems: Benefits and Best Practices </h2> </a> <div class="mt-auto flex flex-wrap items-center gap-1.5 px-10 pt-5 pb-10 max-md:px-4 max-md:pt-3 max-md:pb-5"> <a href="/blog-category/ui-design/" class="inline-flex items-center h-9 px-2.5 bg-muted text-sm font-semibold text-black tracking-[0.02em] whitespace-nowrap no-underline transition-colors hover:bg-accent"> UI Design </a> </div> </article> </li><li class="scroll-reveal-item snap-start shrink-0 grow-0 basis-[34.5rem] w-[34.5rem] min-w-[34.5rem] flex max-lg:basis-[26rem] max-lg:w-[26rem] max-lg:min-w-[26rem] max-md:w-72 max-md:min-w-72 max-md:basis-72" style="--sr-delay: 285ms" data-astro-cid-3fbjgh3j>
32 <article class="w-full bg-surface border border-[#E0E9EC] rounded-[20px] overflow-hidden transition-shadow hover:shadow-[0_2px_5px_rgba(0,0,0,0.1)] flex flex-col h-full"> <a href="/blogs/i-dont-care-what-tools-a-developer-uses-i-hire-based-on-fundamentals/" class="group flex flex-col gap-4 no-underline p-10 pb-0 max-md:p-4 max-md:pb-0 max-md:gap-3"> <h3 class="text-base font-medium text-black uppercase tracking-[0.02em] leading-[38px] truncate m-0 max-md:text-sm max-md:leading-6"> ENGINEERING CULTURE </h3> <div class="w-full h-[17.5rem] overflow-hidden rounded-md bg-muted max-md:h-44"> <img src="/images/blogs/3f2ff601c2_65800e7bff2246883c213677_hiring-culture.jpeg" alt="I donât care what tools a developer uses. I hire based on fundamentals." class="w-full h-full object-cover block transition-transform duration-300 group-hover:scale-[1.04]" loading="lazy" width="560" height="280"> </div> <h2 class="text-xl-plus font-normal text-black leading-[34px] m-0 line-clamp-3 min-h-[102px] group-hover:text-primary max-md:text-xl max-md:leading-7 max-md:min-h-[84px]"> I donât care what tools a developer uses. I hire based on fundamentals. </h2> </a> <div class="mt-auto flex flex-wrap items-center gap-1.5 px-10 pt-5 pb-10 max-md:px-4 max-md:pt-3 max-md:pb-5"> <a href="/blog-category/engineering/" class="inline-flex items-center h-9 px-2.5 bg-muted text-sm font-semibold text-black tracking-[0.02em] whitespace-nowrap no-underline transition-colors hover:bg-accent"> Engineering </a> </div> </article> </li> </ul> </div> <!-- Scroll buttons: shown on section hover (desktop), hidden on mobile --> <button class="blog-btn blog-btn--left absolute top-1/2 -translate-y-1/2 left-0 w-12 h-12 rounded-full border-0 cursor-pointer flex items-center justify-center text-white bg-black/30 backdrop-blur-sm opacity-0 pointer-events-none transition-opacity z-10 max-md:hidden" aria-label="Scroll left" type="button" data-astro-cid-3fbjgh3j> <span class="flex items-center justify-center" aria-hidden="true" data-astro-cid-3fbjgh3j> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="h-4 w-auto" aria-hidden="true" data-astro-cid-3fbjgh3j> <path fill="currentColor" d="M34.5 239L228.9 44.7c9.4-9.4 24.6-9.4 33.9 0l22.7 22.7c9.4 9.4 9.4 24.5 0 33.9L131.5 256l154 154.8c9.3 9.4 9.3 24.5 0 33.9l-22.7 22.7c-9.4 9.4-24.6 9.4-33.9 0L34.5 273c-9.4-9.4-9.4-24.6 0-33.9z" data-astro-cid-3fbjgh3j></path> </svg> </span> </button> <button class="blog-btn blog-btn--right absolute top-1/2 -translate-y-1/2 right-0 w-12 h-12 rounded-full border-0 cursor-pointer flex items-center justify-center text-white bg-black/30 backdrop-blur-sm opacity-0 pointer-events-none transition-opacity z-10 max-md:hidden" aria-label="Scroll right" type="button" data-astro-cid-3fbjgh3j> <span class="flex items-center justify-center" aria-hidden="true" data-astro-cid-3fbjgh3j> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="h-4 w-auto" aria-hidden="true" data-astro-cid-3fbjgh3j> <path fill="currentColor" d="M285.5 273L91.1 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.7-22.7c-9.4-9.4-9.4-24.5 0-33.9L188.5 256 34.5 101.3c-9.3-9.4-9.3-24.5 0-33.9l22.7-22.7c9.4-9.4 24.6-9.4 33.9 0L285.5 239c9.4 9.4 9.4 24.6 0 33.9z" data-astro-cid-3fbjgh3j></path> </svg> </span> </button> </section> </div>
32<script type="module">const a=document.querySelector(".blog-btn--left"),n=document.querySelector(".blog-btn--right"),t=document.querySelector(".blog-card-list"),e=document.querySelector(".blog-scroll-wrapper"),r=580;function o(){if(!t||!e)return;const l=t.scrollLeft<=1,c=t.scrollLeft+t.clientWidth>=t.scrollWidth-1;l?e.setAttribute("data-at-start",""):e.removeAttribute("data-at-start"),c?e.setAttribute("data-at-end",""):e.removeAttribute("data-at-end")}t?.addEventListener("scroll",o,{passive:!0});o();a?.addEventListener("click",()=>{t?.scrollBy({left:-r,behavior:"smooth"})});n?.addEventListener("click",()=>{t?.scrollBy({left:r,behavior:"smooth"})});</script>
32 </div> <div class="w-full max-w-[var(--home-rail-max)] mx-auto px-[var(--home-rail-gutter)] pb-8 bg-bg rounded-t-[40px] flex flex-col gap-8 box-border max-md:pb-6 max-md:gap-6"> <div class="scroll-reveal-group grid grid-cols-2 max-md:grid-cols-1 gap-5 pt-10 max-md:pt-6 w-full" data-astro-cid-y7zmneqf> <!-- Left card: Newsletter --> <!-- id="sib-form-container" required â Brevo's main.js looks up #success-message and #error-message from this root --> <div id="sib-form-container" class="rounded-lg p-10 max-md:px-5 max-md:pt-8 max-md:pb-10 flex flex-col gap-10 max-md:gap-6 bg-newsletter-blue" data-astro-cid-y7zmneqf> <p class="scroll-reveal-item text-2xl font-medium leading-footer text-white m-0" style="--sr-delay: 0ms" data-astro-cid-y7zmneqf>Get updates and tips from the team</p> <div id="sib-container" data-astro-cid-y7zmneqf> <form id="sib-form" class="scroll-reveal-item flex gap-3 flex-wrap" style="--sr-delay: 55ms" action="https://4a0d91fc.sibforms.com/serve/MUIFAIowdRP4zK82ouLpuOrhMjyuJtzS-Bh8ngJDLMBUXA-Tb0k_aiT4-ilcGSVee--J4ws5ZVLwMMvkHgvSRRhsVz25wvZkt0IHsWQYFCV6E5JCA7ahj-AmGsCfv_FkbYe1Bi2xY0eVcVwWLK9_nOZuJaK1kYWHZtok--IVfi1YAY5VK1yHasCKS8o1fNtlrm9KuE4tMZjwGE_03g==" method="post" data-type="subscription" data-astro-cid-y7zmneqf> <label for="EMAIL" class="sr-only" data-astro-cid-y7zmneqf>Your Email</label> <input id="EMAIL" type="email" name="EMAIL" class="flex-1 min-w-32 lg:min-w-40 px-5 py-3 max-lg:py-2.5 rounded-full bg-white/20 text-white text-sm lg:text-base border-0 outline-none placeholder:text-white/65 focus:bg-white/30 transition-colors" placeholder="Your Email" autocomplete="email" required data-astro-cid-y7zmneqf> <input type="text" name="email_address_check" value="" tabindex="-1" autocomplete="off" aria-hidden="true" class="absolute -left-[5000px]" data-astro-cid-y7zmneqf> <input type="hidden" name="locale" value="en" data-astro-cid-y7zmneqf> <button type="submit" class="inline-flex items-center justify-center gap-2 whitespace-nowrap cursor-pointer rounded-full transition-all duration-300 h-[4.25rem] px-[3.125rem] text-lg font-medium border-[1.5px] border-white/85 text-white bg-transparent hover:bg-white/15 flex-none max-lg:!h-11 max-lg:!px-6 max-lg:!text-sm disabled:opacity-60 disabled:cursor-not-allowed" data-astro-cid-y7zmneqf> <svg class="sib-hide-loader-icon w-4 h-4 animate-spin" viewBox="0 0 512 512" fill="currentColor" aria-hidden="true" data-astro-cid-y7zmneqf> <path d="M460.116 373.846l-20.823-12.022c-5.541-3.199-7.54-10.159-4.663-15.874 30.137-59.886 28.343-131.652-5.386-189.946-33.641-58.394-94.896-95.833-161.827-99.676C261.028 55.961 256 50.751 256 44.352V20.309c0-6.904 5.808-12.337 12.703-11.982 83.556 4.306 160.163 50.864 202.11 123.677 42.063 72.696 44.079 162.316 6.031 236.832-3.14 6.148-10.75 8.461-16.728 5.01z" data-astro-cid-y7zmneqf></path> </svg> 33Subscribe 34</button> </form> </div> <div id="error-message" class="sib-form-message-panel text-sm text-amber-200 m-0" role="status" aria-live="polite" data-astro-cid-y7zmneqf> <span class="sib-form-message-panel__inner-text" data-astro-cid-y7zmneqf></span> </div> <div id="success-message" class="sib-form-message-panel text-sm text-white/90 m-0" role="status" aria-live="polite" data-astro-cid-y7zmneqf> <span class="sib-form-message-panel__inner-text" data-astro-cid-y7zmneqf></span> </div> </div> <!-- Right card: Follow Us --> <div class="rounded-lg p-10 max-md:px-5 max-md:pt-8 max-md:pb-10 flex flex-col gap-10 max-md:gap-6 bg-social-
34dark" data-astro-cid-y7zmneqf> <p class="scroll-reveal-item text-2xl font-medium leading-footer text-white m-0" style="--sr-delay: 110ms" data-astro-cid-y7zmneqf>Follow Us</p> <div class="scroll-reveal-item flex gap-5 items-center flex-wrap" style="--sr-delay: 175ms" aria-label="Social media links" data-astro-cid-y7zmneqf> <a href="https://www.facebook.com/oursky.hk" class="flex items-center justify-center w-7 h-7 text-white no-underline transition-all hover:opacity-75 hover:scale-110 [&_svg]:w-full [&_svg]:h-full [&_svg]:fill-current" target="_blank" rel="noopener noreferrer" aria-label="Facebook" data-astro-cid-y7zmneqf> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" data-astro-cid-y7zmneqf><path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z" data-astro-cid-y7zmneqf></path></svg> </a><a href="https://www.linkedin.com/company/oursky-limited/" class="flex items-center justify-center w-7 h-7 text-white no-underline transition-all hover:opacity-75 hover:scale-110 [&_svg]:w-full [&_svg]:h-full [&_svg]:fill-current" target="_blank" rel="noopener noreferrer" aria-label="LinkedIn" data-astro-cid-y7zmneqf> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" data-astro-cid-y7zmneqf><path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 01-2.063-2.065 2.064 2.064 0 112.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z" data-astro-cid-y7zmneqf></path></svg> </a><a href="https://www.instagram.com/oursky.hk/" class="flex items-center justify-center w-7 h-7 text-white no-underline transition-all hover:opacity-75 hover:scale-110 [&_svg]:w-full [&_svg]:h-full [&_svg]:fill-current" target="_blank" rel="noopener noreferrer" aria-label="Instagram" data-astro-cid-y7zmneqf> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" data-astro-cid-y7zmneqf><path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838a6.162 6.162 0 100 12.324 6.162 6.162 0 000-12.324zM12 16a4 4 0 110-8 4 4 0 010 8zm6.406-11.845a1.44 1.44 0 100 2.881 1.44 1.44 0 000-2.881z" data-astro-cid-y7zmneqf></path></svg> </a><a href="https://x.com/oursky" class="flex items-center justify-center w-7 h-7 text-white no-underline transition-all hover:opacity-75 hover:scale-110 [&_svg]:w-full [&_svg]:h-full [&_svg]:fill-current" target="_blank" rel="noopener noreferrer" aria-label="X (Twitter)" data-astro-cid-y7zmneqf> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" data-astro-cid-y7zmneqf><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-4.714-6.231-5.401 6.231H2.744l7.73-8.835L1.254 2.25H8.08l4.253 5.622zm-1.161 17.52h1.833L7.084 4.126H5.117z" data-astro-cid-y7zmneqf></path></svg> </a><a href="https://mastodon.social/@[email protected]" class="flex items-center justify-center w-7 h-7 text-white no-underline transition-all hover:opacity-75 hover:scale-110 [&_svg]:w-full [&_svg]:h-full [&_svg]:fill-current" target="_blank" rel="noopener noreferrer" aria-label="Mastodon" data-astro-cid-y7zmneqf> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" data-astro-cid-y7zmneqf><path d="M23.268 5.313c-.35-2.578-2.617-4.61-5.304-5.004C17.51.242 15.792 0 11.813 0h-.03c-3.98 0-4.835.242-5.288.309C3.882.692 1.496 2.518.917 5.127.64 6.412.61 7.837.661 9.143c.074 1.874.088 3.745.26 5.611.118 1.24.325 2.47.62 3.68.55 2.237 2.777 4.098 4.96 4.857 2.336.792 4.849.923 7.256.38.265-.061.527-.132.786-.213.585-.184 1.27-.39 1.774-.753a.057.057 0 00.023-.043v-1.809a.052.052 0 00-.02-.041.053.053 0 00-.046-.01 20.282 20.282 0 01-4.709.545c-2.73 0-3.463-1.284-3.674-1.818a5.593 5.593 0 01-.319-1.433.053.053 0 01.066-.054c1.517.363 3.072.546 4.632.546.376 0 .75 0 1.125-.01 1.57-.044 3.224-.124 4.768-.422.038-.008.077-.015.11-.024 2.435-.464 4.753-1.92 4.989-5.604.008-.145.03-1.52.03-1.67.002-.512.167-3.63-.024-5.545zm-3.748 9.195h-2.561V8.29c0-1.309-.55-1.976-1.67-1.976-1.23 0-1.846.79-1.846 2.35v3.403h-2.546V8.663c0-1.56-.617-2.35-1.848-2.35-1.112 0-1.668.668-1.67 1.977v6.218H4.822V8.102c0-1.31.337-2.35 1.011-3.12.696-.77 1.608-1.164 2.74-1.164 1.311 0 2.302.5 2.962 1.498l.638 1.06.638-1.06c.66-.999 1.65-1.498 2.96-1.498 1.13 0 2.043.395 2.74 1.164.675.77 1.012 1.81 1.012 3.12z" data-astro-cid-y7zmneqf></path></svg> </a><a href="https://github.com/oursky" class="flex items-center justify-center w-7 h-7 text-white no-underline transition-all hover:opacity-75 hover:scale-110 [&_svg]:w-full [&_svg]:h-full [&_svg]:fill-current" target="_blank" rel="noopener noreferrer" aria-label="GitHub" data-astro-cid-y7zmneqf> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" data-astro-cid-y7zmneqf><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12" data-astro-cid-y7zmneqf></path></svg> </a><a href="/blog/" class="flex items-center justify-center w-7 h-7 text-white no-underline transition-all hover:opacity-75 hover:scale-110 [&_svg]:w-full [&_svg]:h-full [&_svg]:fill-current" aria-label="Oursky Blog" data-astro-cid-y7zmneqf> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 41 36" aria-hidden="true" data-astro-cid-y7zmneqf><path d="M13.7734 4.25C12.6797 4.25 11.8984 5.10938 11.8984 6.125V29.875C11.8984 30.5781 11.7422 31.2031 11.5078 31.75H35.0234C36.0391 31.75 36.8984 30.9688 36.8984 29.875V6.125C36.8984 5.10938 36.0391 4.25 35.0234 4.25H13.7734ZM6.27344 35.5C3.14844 35.5 0.648438 33 0.648438 29.875V6.75C0.648438 5.73438 1.42969 4.875 2.52344 4.875C3.53906 4.875 4.39844 5.73438 4.39844 6.75V29.875C4.39844 30.9688 5.17969 31.75 6.27344 31.75C7.28906 31.75 8.14844 30.9688 8.14844 29.875V6.125C8.14844 3.07812 10.6484 0.5 13.7734 0.5H35.0234C38.0703 0.5 40.6484 3.07812 40.6484 6.125V29.875C40.6484 33 38.0703 35.5 35.0234 35.5H6.27344ZM14.3984 8.625C14.3984 7.60938 15.1797 6.75 16.2734 6.75H23.7734C24.7891 6.75 25.6484 7.60938 25.6484 8.625V14.875C25.6484 15.9688 24.7891 16.75 23.7734 16.75H16.2734C15.1797 16.75 14.3984 15.9688 14.3984 14.875V8.625ZM30.0234 6.75H32.5234C33.5391 6.75 34.3984 7.60938 34.3984 8.625C34.3984 9.71875 33.5391 10.5 32.5234 10.5H30.0234C28.9297 10.5 28.1484 9.71875 28.1484 8.625C28.1484 7.60938 28.9297 6.75 30.0234 6.75ZM30.0234 13H32.5234C33.5391 13 34.3984 13.8594 34.3984 14.875C34.3984 15.9688 33.5391 16.75 32.5234 16.75H30.0234C28.9297 16.75 28.1484 15.9688 28.1484 14.875C28.1484 13.8594 28.9297 13 30.0234 13ZM16.2734 19.25H32.5234C33.5391 19.25 34.3984 20.1094 34.3984 21.125C34.3984 22.2188 33.5391 23 32.5234 23H16.2734C15.1797 23 14.3984 22.2188 14.3984 21.125C14.3984 20.1094 15.1797 19.25 16.2734 19.25ZM16.2734 25.5H32.5234C33.5391 25.5 34.3984 26.3594 34.3984 27.375C34.3984 28.4688 33.5391 29.25 32.5234 29.25H16.2734C15.1797 29.25 14.3984 28.4688 14.3984 27.375C14.3984 26.3594 15.1797 25.5 16.2734 25.5Z" data-astro-cid-y7zmneqf></path></svg> </a> </div> </div> </div>
34<script> 35 window.REQUIRED_CODE_ERROR_MESSAGE = 'Please choose a country code'; 36 window.LOCALE = 'en'; 37 window.EMAIL_INVALID_MESSAGE = window.SMS_INVALID_MESSAGE = "The information provided is invalid. Please review the field format and try again."; 38 window.REQUIRED_ERROR_MESSAGE = "This field cannot be left blank. "; 39 window.GENERIC_INVALID_MESSAGE = "The information provided is invalid. Please review the field format and try again."; 40 window.translation = { 41 common: { 42 selectedList: '{quantity} list selected', 43 selectedLists: '{quantity} lists selected', 44 selectedOption: '{quantity} selected', 45 selectedOptions: '{quantity} selected', 46 } 47 }; 48 window.AUTOHIDE = false; 49</script>
49
49<script defer src="https://sibforms.com/forms/end-form/build/main.js"></script>
49 <div class="scroll-reveal-group grid [grid-template-columns:2fr_3fr] rounded-lg overflow-hidden min-h-[26rem] max-lg:grid-cols-1"> <!-- Banner side (left) --> <div class="bg-black p-10 max-md:px-5 max-md:pt-8 max-md:pb-10 flex flex-col gap-3 bg-[url('/images/os-w-4.svg')] bg-center bg-no-repeat bg-auto"> <h2 class="scroll-reveal-item text-2xl font-bold leading-footer text-white m-0" style="--sr-delay: 0ms">How can we help?</h2> <p class="scroll-reveal-item m-0" style="--sr-delay: 55ms"> <a href="mailto:[email protected]" class="text-2xl font-normal leading-footer text-white no-underline transition-opacity hover:opacity-75 hover:underline"> 50[email protected] 51</a> </p> </div> <!-- Form side (right) --> <div class="scroll-reveal-item bg-surface p-10 max-md:px-5 max-md:pt-8 max-md:pb-10 flex flex-col gap-5" style="--sr-delay: 95ms"> <div class="contact-form-wrapper"> <form action='/' class='contact-form flex flex-col gap-3.5' method='post' name='oursky-contact'> <input type="hidden" name="form-name" value="oursky-contact"> <p class="hidden" aria-hidden="true"> <label> 52Don't fill this out if you're human: 53<input name="bot-field" tabindex="-1" autocomplete="off"> </label> </p> <h2 class="text-xl font-bold text-black mb-2">Contacts</h2> <div class="grid grid-cols-2 max-[599px]:grid-cols-1 gap-3"> <div class="flex flex-col"> <label for="contact-name" class="sr-only">Name</label> <input id="contact-name" type="text" name="name" class="w-full px-4 py-[1.1rem] rounded-md bg-black/5 text-base text-text outline-none transition-colors focus:bg-black/10 box-border placeholder:text-text-muted" placeholder="Name" autocomplete="name"> </div> <div class="flex flex-col"> <label for="contact-company" class="sr-only">Company</label> <input id="contact-company" type="text" name="company" class="w-full px-4 py-[1.1rem] rounded-md bg-black/5 text-base text-text outline-none transition-colors focus:bg-black/10 box-border placeholder:text-text-muted" placeholder="Company" autocomplete="organization"> </div> </div> <div class="flex flex-col"> <label for="contact-email" class="sr-only">Email</label> <input id="contact-email" type="email" name="email" class="w-full px-4 py-[1.1rem] rounded-md bg-black/5 text-base text-text outline-none transition-colors focus:bg-black/10 box-border placeholder:text-text-muted" placeholder="Email" autocomplete="email" required> </div> <div class="flex flex-col"> <label for="contact-message" class="sr-only">Message</label> <textarea id="contact-message" name="message" class="w-full px-4 py-[1.1rem] rounded-md bg-black/5 text-base text-text outline-none transition-colors focus:bg-black/10 box-border resize-y min-h-[11rem] placeholder:text-text-muted" rows="4" placeholder="Your Message"></textarea> </div> <button type="submit" class="inline-flex items-center justify-center whitespace-nowrap no-underline cursor-pointer rounded-full transition-all duration-300 h-[4.25rem] px-[3.125rem] text-lg font-black bg-primary-dark text-black hover:scale-105 hover:shadow-[0_4px_16px_rgba(226,159,52,0.4)] self-start">Let's Talk</button> </form> <div class="contact-form-status mt-4 text-base hidden" role="status" aria-live="polite"></div> <div class="contact-form-success hidden flex-col items-center gap-6 py-10 text-center" role="status" aria-live="polite"> <div class="flex items-center justify-center w-16 h-16 rounded-full bg-primary-dark/20"> <svg width="32" height="32" viewBox="0 0 32 32" fill="none" aria-hidden="true"> <path d="M6 16.5L12.5 23L26 9" stroke="#c8830a" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"></path> </svg> </div> <h3 class="text-2xl font-black text-black m-0">Message received!</h3> <p class="text-base text-text m-0 max-w-md leading-relaxed"> 54Thanks for reaching out â we aim to get back to you within 2 business days. 55</p> </div> </div>
55<script type="module">const i='form.contact-form[name="oursky-contact"]';function r(){document.querySelectorAll(i).forEach(e=>{e.dataset.listenerAttached||(e.dataset.listenerAttached="true",e.addEventListener("submit",async c=>{c.preventDefault();const a=e.closest(".contact-form-wrapper"),t=a?.querySelector(".contact-form-status")??null,n=a?.querySelector(".contact-form-success")??null,s=e.querySelector('button[type="submit"]');s&&(s.disabled=!0),t&&(t.hidden=!1,t.classList.remove("hidden","text-red-600"),t.classList.add("text-text-muted"),t.textContent="Sendingâ¦");try{const d=new URLSearchParams(new FormData(e)),o=await fetch("/",{method:"POST",headers:{"Content-Type":"application/x-www-form-urlencoded"},body:d.toString()});if(!o.ok)throw new Error(`HTTP ${o.status}`);e.hidden=!0,t&&(t.hidden=!0),n&&(n.classList.remove("hidden"),n.classList.add("flex"))}catch{t&&(t.classList.remove("text-text-muted"),t.classList.add("text-red-600"),t.textContent="Something went wrong. Please try again, or email [email protected]."),s&&(s.disabled=!1)}}))})}r();document.addEventListener("astro:page-load",r);</script>
55 </div> </div> </div> </section> </div>
55<script type="module">function c(){const o=document.querySelectorAll(".home-page .scroll-reveal"),s=document.querySelectorAll(".home-page .scroll-reveal-group");if(!o.length&&!s.length)return;if(window.matchMedia("(prefers-reduced-motion: reduce)").matches){o.forEach(e=>e.classList.add("scroll-reveal--visible")),s.forEach(e=>e.classList.add("scroll-reveal-group--visible"));return}const l=new IntersectionObserver((e,n)=>{for(const t of e){if(!t.isIntersecting)continue;const r=t.target;r.classList.contains("scroll-reveal-group")?r.classList.add("scroll-reveal-group--visible"):r.classList.add("scroll-reveal--visible"),n.unobserve(r)}},{root:null,rootMargin:"0px 0px -5% 0px",threshold:.05});o.forEach(e=>l.observe(e)),s.forEach(e=>l.observe(e))}c();document.addEventListener("astro:page-load",c);</script>
55 </main> <footer class="site-footer w-full bg-bg"> <div class="w-full max-w-[1360px] mx-auto px-10 pb-10 box-border max-md:px-5 max-md:pb-5"> <!-- Dark card: logo + clocks --> <div class="bg-black rounded-lg flex justify-between items-center px-10 py-20 gap-8 mb-8 max-lg:flex-col max-lg:items-start max-lg:px-8 max-lg:py-16 max-md:px-6 max-md:py-12 max-md:mb-6"> <!-- Left: OURSKY logo + "We are hiring!" --> <div class="flex flex-col gap-3 justify-between shrink-0"> <div class="flex items-center gap-2 pr-10"> <a id="footer-logo-link" href="/" data-astro-reload class="inline-flex items-center gap-2 no-underline" aria-label="Oursky home"> <div id="footer-logo-lottie" class="w-20 h-20 shrink-0" aria-hidden="true"></div> <img src="/images/oursky-logo-footer.svg" alt="Oursky" width="141" height="30" class="block h-auto" style="width: 10rem"> </a> </div> <a href="https://jobs.oursky.com" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1 text-primary-dark text-lg font-bold leading-footer no-underline transition-opacity hover:opacity-60"> 56We are hiring! 57<span class="font-bold" aria-hidden="true">â</span> </a> </div> <!-- Right: two live clocks --> <div class="flex gap-12 items-start max-lg:gap-8 max-md:flex-col max-md:gap-6"> <!-- HK clock --> <div class="flex gap-8 flex-wrap items-start max-md:gap-5"> <div id="clock-container--hk" class="flex flex-col items-center justify-center"> <div class="flex justify-center items-center w-[6.3762rem] h-[6.3762rem] relative"> <svg class="w-full h-full" width="103" height="103" viewBox="0 0 103 103" fill="none" xmlns="http://www.w3.org/2000/svg"> 58 <path d="M54.5098 0H48.7708L51.5862 4.40147L54.5098 0Z" fill="#D9D9D9"/> 59 <path d="M54.5098 102.017H48.7708L51.5862 97.6151L54.5098 102.017Z" fill="#D9D9D9"/> 60 <path d="M28.621 5.39904L23.6509 8.26855L28.2899 10.6726L28.621 5.39904Z" fill="#D9D9D9"/> 61 <path d="M79.6293 93.7482L74.6592 96.6177L74.8967 91.3982L79.6293 93.7482Z" fill="#D9D9D9"/> 62 <path d="M102.648 53.8777L102.648 48.1387L98.247 50.9541L102.648 53.8777Z" fill="#D9D9D9"/> 63 <path d="M0.631836 53.8777L0.631836 48.1387L5.03331 50.9541L0.631836 53.8777Z" fill="#D9D9D9"/> 64 <path d="M97.2494 27.9892L94.3799 23.019L91.9758 27.658L97.2494 27.9892Z" fill="#D9D9D9"/> 65 <path d="M8.90052 78.9975L6.03101 74.0273L11.2505 74.2649L8.90052 78.9975Z" fill="#D9D9D9"/> 66 <path d="M79.6293 8.26844L74.6592 5.39893L74.8967 10.6184L79.6293 8.26844Z" fill="#D9D9D9"/> 67 <path d="M28.621 96.6176L23.6509 93.748L28.2899 91.344L28.621 96.6176Z" fill="#D9D9D9"/> 68 <path d="M94.38 78.9975L97.2495 74.0273L92.03 74.2649L94.38 78.9975Z" fill="#D9D9D9"/> 69 <path d="M6.03088 27.9892L8.90039 23.019L11.3045 27.658L6.03088 27.9892Z" fill="#D9D9D9"/> 70 <circle cx="51.6928" cy="51.0082" r="2.86951" fill="white"/> 71 <path class="clock__hand--hour" d="M49.1198 32.6873L51.7019 51.0098L54.1075 32.6741C52.5607 30.4796 51.6389 27.2997 51.6389 27.2997C51.6389 27.2997 50.6561 30.4053 49.1198 32.6873Z" fill="white"/> 72 <path class="clock__hand--minute" d="M49.0737 16.8969L51.7007 51.0147L54.0613 16.8832C52.5143 14.6888 51.5794 6.81542 51.5794 6.81542C51.5794 6.81542 50.6098 14.6147 49.0737 16.8969Z" fill="white"/> 73 </svg> </div> <p class="text-white mt-3 mb-0 text-lg leading-footer max-md:text-base">--:--</p> </div> <div class="flex flex-col gap-0"> <h3 class="text-white m-0 text-lg font-semibold leading-footer max-md:text-base max-md:leading-[1.8rem]">Oursky</h3> <p class="text-white m-0 text-lg leading-footer opacity-80 max-md:text-base max-md:leading-[1.8rem]">Hong Kong</p> <p class="text-white m-0 text-lg leading-footer opacity-80 max-md:text-base max-md:leading-[1.8rem]">Taipei</p> </div> </div> <!-- London clock --> <div class="flex gap-8 flex-wrap items-start max-md:gap-5"> <div id="clock-container--london" class="flex flex-col items-center justify-center"> <div class="flex justify-center items-center w-[6.3762rem] h-[6.3762rem] relative"> <svg class="w-full h-full" width="103" height="103" viewBox="0 0 103 103" fill="none" xmlns="http://www.w3.org/2000/svg"> 74 <path d="M54.5098 0H48.7708L51.5862 4.40147L54.5098 0Z" fill="#D9D9D9"/> 75 <path d="M54.5098 102.017H48.7708L51.5862 97.6151L54.5098 102.017Z" fill="#D9D9D9"/> 76 <path d="M28.621 5.39904L23.6509 8.26855L28.2899 10.6726L28.621 5.39904Z" fill="#D9D9D9"/> 77 <path d="M79.6293 93.7482L74.6592 96.6177L74.8967 91.3982L79.6293 93.7482Z" fill="#D9D9D9"/> 78 <path d="M102.648 53.8777L102.648 48.1387L98.247 50.9541L102.648 53.8777Z" fill="#D9D9D9"/> 79 <path d="M0.631836 53.8777L0.631836 48.1387L5.03331 50.9541L0.631836 53.8777Z" fill="#D9D9D9"/>
80 <path d="M97.2494 27.9892L94.3799 23.019L91.9758 27.658L97.2494 27.9892Z" fill="#D9D9D9"/> 81 <path d="M8.90052 78.9975L6.03101 74.0273L11.2505 74.2649L8.90052 78.9975Z" fill="#D9D9D9"/> 82 <path d="M79.6293 8.26844L74.6592 5.39893L74.8967 10.6184L79.6293 8.26844Z" fill="#D9D9D9"/> 83 <path d="M28.621 96.6176L23.6509 93.748L28.2899 91.344L28.621 96.6176Z" fill="#D9D9D9"/> 84 <path d="M94.38 78.9975L97.2495 74.0273L92.03 74.2649L94.38 78.9975Z" fill="#D9D9D9"/> 85 <path d="M6.03088 27.9892L8.90039 23.019L11.3045 27.658L6.03088 27.9892Z" fill="#D9D9D9"/> 86 <circle cx="51.6928" cy="51.0082" r="2.86951" fill="white"/> 87 <path class="clock__hand--hour" d="M49.1198 32.6873L51.7019 51.0098L54.1075 32.6741C52.5607 30.4796 51.6389 27.2997 51.6389 27.2997C51.6389 27.2997 50.6561 30.4053 49.1198 32.6873Z" fill="white"/> 88 <path class="clock__hand--minute" d="M49.0737 16.8969L51.7007 51.0147L54.0613 16.8832C52.5143 14.6888 51.5794 6.81542 51.5794 6.81542C51.5794 6.81542 50.6098 14.6147 49.0737 16.8969Z" fill="white"/> 89 </svg> </div> <p class="text-white mt-3 mb-0 text-lg leading-footer max-md:text-base">--:--</p> </div> <div class="flex flex-col gap-0"> <h3 class="text-white m-0 text-lg font-semibold leading-footer max-md:text-base max-md:leading-[1.8rem]">Skymakers</h3> <p class="text-white m-0 text-lg leading-footer opacity-80 max-md:text-base max-md:leading-[1.8rem]">London</p> <p class="text-white m-0 text-lg leading-footer opacity-80 max-md:text-base max-md:leading-[1.8rem]">Manchester</p> </div> </div> </div> </div> <!-- Open Source bar --> <div class="bg-footer-opensource rounded-lg px-8 py-5 max-md:px-6 max-md:py-4"> <a href="/open-source/" class="flex items-center justify-between no-underline transition-opacity hover:opacity-60"> <span class="text-black text-lg font-bold max-md:text-base">We ð» Open Source!</span> <span class="text-black text-lg font-bold max-md:text-base" aria-hidden="true">â</span> </a> </div> <!-- Copyright --> <p class="text-center text-black/60 text-sm mt-3 mb-0">Oursky Ltd. © 2026</p> </div> </footer>
89<script type="module">const h="Asia/Hong_Kong",g="Europe/London";function r(t,c,e){if(!t)return;const n=new Intl.DateTimeFormat("en-HK",{hour:"numeric",minute:"numeric",hour12:!0,timeZone:e}).formatToParts(c),o={};n.forEach(f=>o[f.type]=f.value);const i=t.querySelector(".clock__hand--minute"),s=t.querySelector(".clock__hand--hour"),u=t.querySelector("p"),d=parseInt(o.minute??"0"),m=parseInt(o.hour??"0"),I=o.dayPeriod??"",l=d/60,k=(l+m)/12;u&&(u.textContent=`${m}:${String(d).padStart(2,"0")}${I}`),i&&i.setAttribute("transform",`rotate(${l*360}, 51.6928, 51.0082)`),s&&s.setAttribute("transform",`rotate(${k*360}, 51.6928, 51.0082)`)}let y;function p(){clearInterval(y);const t=document.getElementById("clock-container--hk"),c=document.getElementById("clock-container--london"),e=new Date;r(t,e,h),r(c,e,g);let a=e.getUTCMinutes();y=setInterval(()=>{const n=new Date;n.getUTCMinutes()!==a&&(a=n.getUTCMinutes(),r(document.getElementById("clock-container--hk"),n,h),r(document.getElementById("clock-container--london"),n,g))},1e3)}document.addEventListener("astro:page-load",p);</script>
89
89<script type="module" src="/_astro/Footer.astro_astro_type_script_index_1_lang.BMosPksR.js"></script>
89 </body></html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.