CINXE.COM

<!DOCTYPE html><html data-wf-domain="infinite.red" data-wf-page="6520a204aec4d72161e3d620" data-wf-site="5e67db0c1e7a468249544a75" lang="en"><head><meta charset="utf-8"/><title>Remote Work - Creating honest solutions to your toughest design problems</title><meta content="We're a friendly group of React Native developers and designers in the US who build impactful products and relationships." name="description"/><meta content="Remote Work - Creating honest solutions to your toughest design problems" property="og:title"/><meta content="We're a friendly group of React Native developers and designers in the US who build impactful products and relationships." property="og:description"/><meta content="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5f80cc1fe7e52347ee9eb300_graph-ir.jpg" property="og:image"/><meta content="Remote Work - Creating honest solutions to your toughest design problems" property="twitter:title"/><meta content="We're a friendly group of React Native developers and designers in the US who build impactful products and relationships." property="twitter:description"/><meta content="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5f80cc1fe7e52347ee9eb300_graph-ir.jpg" property="twitter:image"/><meta property="og:type" content="website"/><meta content="summary_large_image" name="twitter:card"/><meta content="width=device-width, initial-scale=1" name="viewport"/><meta content="google-site-verification=Jmms0_XFcgBIDl9Ly7pfogukm_9GOpVAM36Uu59c71k" name="google-site-verification"/><link href="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/css/infinite-red-website.9c4de44fd.min.css" rel="stylesheet" type="text/css"/><link href="https://fonts.googleapis.com" rel="preconnect"/><link href="https://fonts.gstatic.com" rel="preconnect" crossorigin="anonymous"/><script src="https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js" type="text/javascript"></script><script type="text/javascript">WebFont.load({ google: { families: ["Montserrat:100,100italic,200,200italic,300,300italic,400,400italic,500,500italic,600,600italic,700,700italic,800,800italic,900,900italic","Droid Serif:400,400italic,700,700italic","Merriweather:300,300italic,400,400italic,700,700italic,900,900italic"] }});</script><script type="text/javascript">!function(o,c){var n=c.documentElement,t=" w-mod-";n.className+=t+"js",("ontouchstart"in o||o.DocumentTouch&&c instanceof DocumentTouch)&&(n.className+=t+"touch")}(window,document);</script><link href="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5e96204b6085211e0c7f48f2_favicon.png" rel="shortcut icon" type="image/x-icon"/><link href="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5e96204d92bbee4276b5761c_webclip.png" rel="apple-touch-icon"/><script async="" src="https://www.googletagmanager.com/gtag/js?id=UA-41822601-3"></script><script type="text/javascript">window.dataLayer = window.dataLayer || [];function gtag(){dataLayer.push(arguments);}gtag('js', new Date());gtag('config', 'UA-41822601-3', {'anonymize_ip': false});</script><style> .container-scroll { scrollbar-width: none; /* Firefox 64 */ -ms-overflow-style: none; /* Internet Explorer 11 */ } .container-scroll::-webkit-scrollbar { /** WebKit */ display: none; } .team__collection__list { display: flex; flex-flow: row wrap; justify-content: space-between; } .team__collection__list::after { content: ""; flex: auto; } </style> <meta property="og:image:width" content="1200" /> <meta property="og:image:height" content="630" /> <meta name="google-site-verification" content="PziDawbND-UbE8RPHIApiyKHqLwhQqNCzyAYEmFW-Tc" />  <script async src="https://www.googletagmanager.com/gtag/js?id=UA-41822601-9"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'UA-41822601-9'); </script> <script type="text/javascript"> (function() { window._pa = window._pa || {}; // _pa.orderId = "myOrderId"; // OPTIONAL: attach unique conversion identifier to conversions // _pa.revenue = "19.99"; // OPTIONAL: attach dynamic purchase values to conversions // _pa.productId = "myProductId"; // OPTIONAL: Include product ID for use with dynamic ads var pa = document.createElement('script'); pa.type = 'text/javascript'; pa.async = true; pa.src = ('https:' == document.location.protocol ? 'https:' : 'http:') + "//tag.perfectaudience.com/serve/5dcb4b56acb1888586000015.js"; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(pa, s); })(); </script> <meta name="ahrefs-site-verification" content="b989772c57dd9a5233657e546e1671f8a09c12705f5bda677a2a437ada46bd23"> <style> .w-nav-link.w--current{ color: #e73536 !important; } .w__menu__link.w--current{ color: #e73536 !important; } .nav-dropdown__link.w--current{ color: #e73536 !important; } </style> <script src="https://api.mapbox.com/mapbox-gl-js/v1.10.0/mapbox-gl.js"></script> <link href="https://api.mapbox.com/mapbox-gl-js/v1.10.0/mapbox-gl.css" rel="stylesheet" /></head><body><div data-animation="over-right" class="top-nav w-nav" data-easing2="ease" data-easing="ease" data-collapse="medium" data-w-id="48941a4f-8c15-7a61-3715-67421ac8b695" role="banner" data-no-scroll="1" data-duration="400" data-doc-height="1"><div class="top-nav-container"><div class="top-nav-wrapper"><a href="/" class="top-nav-brand w-inline-block"><div class="top-nav-brand-image w-embed"><?xml version="1.0" encoding="UTF-8"?> <svg width="93px" height="41px" viewBox="0 0 93 41" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">  <title>logo-dark</title> <desc>Created with Sketch.</desc> <g id="Navigation" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="Navigation/Top-Nav/-Transparent" transform="translate(-128.000000, -35.000000)"> <g id="Main-Nav"> <rect id="bounds" x="0" y="0" width="1440" height="111"></rect> <g id="Group" transform="translate(128.000000, 35.000000)"> <g id=".nav__logo--light"> <g id="IR-Logo"> <path d="M36.0800073,0.0610119048 C42.9412217,0.0610119048 48.5033343,5.70727865 48.5033343,12.6723024 C48.5033343,19.6373262 42.9412217,25.283593 36.0800073,25.283593 C29.2187929,25.283593 23.6566802,19.6373262 23.6566802,12.6723024 C23.6566802,5.70727865 29.2187929,0.0610119048 36.0800073,0.0610119048 Z M36.0800073,6.05258288 C32.4785269,6.05258288 29.5589506,9.0163321 29.5589506,12.6723024 C29.5589506,16.3282728 32.4785269,19.292022 36.0800073,19.292022 C39.6814876,19.292022 42.601064,16.3282728 42.601064,12.6723024 C42.601064,9.0163321 39.6814876,6.05258288 36.0800073,6.05258288 Z" id="infinity-left-circle" fill="#E73536"></path> <path d="M56.166766,0.0610119048 C63.0279804,0.0610119048 68.590093,5.70727865 68.590093,12.6723024 C68.590093,19.6373262 63.0279804,25.283593 56.166766,25.283593 C52.9181748,25.283593 49.9608105,24.0178383 47.7471521,21.9456543 C49.0744843,20.2188082 50.035948,18.189109 50.5152955,15.9759446 C51.640891,17.9578044 53.7503391,19.292022 56.166766,19.292022 C59.7682463,19.292022 62.6878227,16.3282728 62.6878227,12.6723024 C62.6878227,9.0163321 59.7682463,6.05258288 56.166766,6.05258288 C53.7340603,6.05258288 51.6124835,7.40483749 50.4916749,9.40927321 C49.997631,7.20099506 49.0222034,5.17810314 47.6836756,3.46012579 C49.9032037,1.35155427 52.8865199,0.0610119048 56.166766,0.0610119048 Z" id="infinity-right-circle" fill="#E73536"></path> <polygon id="Path-Copy-2" fill="currentColor" points="58.9649039 31.2751639 58.9649039 33.1898292 54.2453185 33.1898292 54.2453185 35.1733672 58.4902329 35.1733672 58.4902329 37.005385 54.2453185 37.005385 54.2453185 39.0026977 59.1140862 39.0026977 59.1140862 40.9035883 52.1296423 40.9035883 52.1296423 31.2751639"></polygon> <polygon id="Path-Copy-3" fill="currentColor" points="47.8422083 33.1347309 47.8422083 40.9035883 45.726532 40.9035883 45.726532 33.1347309 43.0412507 33.1347309 43.0412507 31.2751639 50.5274896 31.2751639 50.5274896 33.1347309"></polygon> <polygon id="Path-Copy-4" fill="currentColor" points="39.3544503 31.2751639 41.4701265 31.2751639 41.4701265 40.9035883 39.3544503 40.9035883"></polygon> <polygon id="Path-Copy-5" fill="currentColor" points="34.9258805 31.2751639 37.0415567 31.2751639 37.0415567 40.9035883 34.9258805 40.9035883 30.4097255 34.8703267 30.4097255 40.9035883 28.2940493 40.9035883 28.2940493 31.2751639 30.2741052 31.2751639 34.9258805 37.4737204"></polygon> <polygon id="Path-Copy-6" fill="currentColor" points="23.835593 31.2751639 25.9512692 31.2751639 25.9512692 40.9035883 23.835593 40.9035883"></polygon> <polygon id="Path-Copy-7" fill="currentColor" points="22.1143698 31.2751639 22.1143698 33.16228 17.7202731 33.16228 17.7202731 35.2422401 21.8973774 35.2422401 21.8973774 37.1293561 17.7202731 37.1293561 17.7202731 40.9035883 15.6045969 40.9035883 15.6045969 31.2751639"></polygon> <polygon id="Path-Copy-8" fill="currentColor" points="11.0902875 31.2751639 13.2059637 31.2751639 13.2059637 40.9035883 11.0902875 40.9035883 6.57413246 34.8703267 6.57413246 40.9035883 4.45845625 40.9035883 4.45845625 31.2751639 6.43851219 31.2751639 11.0902875 37.4737204"></polygon> <polygon id="Path-Copy-9" fill="currentColor" points="0 31.2751639 2.11567622 31.2751639 2.11567622 40.9035883 0 40.9035883"></polygon> <path d="M68.5843109,31.2751639 C70.0580585,31.2751639 71.1091051,31.5276952 71.7374822,32.0327653 C72.3658592,32.5378354 72.6800431,33.3505269 72.6800431,34.4708642 C72.6800431,36.0136237 72.0787992,37.0099743 70.8762935,37.4599458 L73.2767722,40.9035883 L70.672863,40.9035883 L68.5707489,37.8318592 L67.1060499,37.8318592 L67.1060499,40.9035883 L64.9903737,40.9035883 L64.9903737,31.2751639 L68.5843109,31.2751639 Z M68.6348799,33.1039121 L67.0481228,33.1039121 L67.0481228,35.9552481 L68.5941938,35.9552481 C69.3175056,35.9552481 69.8102543,35.8358697 70.0724548,35.5971092 C70.3346553,35.3583488 70.4657536,34.979552 70.4657536,34.4607072 C70.4657536,33.9418625 70.3301347,33.586023 70.0588928,33.3931781 C69.7876509,33.2003331 69.3129847,33.1039121 68.6348799,33.1039121 Z" id="Path-Copy-11" fill="currentColor"></path> <polygon id="Path-Copy-12" fill="currentColor" points="81.6856828 31.2751639 81.6856828 33.1898292 76.9660974 33.1898292 76.9660974 35.1733672 81.2110119 35.1733672 81.2110119 37.005385 76.9660974 37.005385 76.9660974 39.0026977 81.8348651 39.0026977 81.8348651 40.9035883 74.8504212 40.9035883 74.8504212 31.2751639"></polygon> <path d="M87.0314148,31.2751639 C88.722156,31.2751639 90.0195769,31.6952841 90.9237166,32.5355371 C91.8278562,33.37579 92.2799193,34.544321 92.2799193,36.0411651 C92.2799193,37.5380092 91.8391578,38.7226104 90.9576216,39.5950042 C90.0760855,40.4673979 88.7311979,40.9035883 86.9229186,40.9035883 L83.6815941,40.9035883 L83.6815941,31.2751639 L87.0314148,31.2751639 Z M87.0049791,33.1039121 L85.8250827,33.1039121 L85.8250827,38.9581043 L87.1677234,38.9581043 C88.1351528,38.9581043 88.8787965,38.7101645 89.3986768,38.2142775 C89.9185571,37.7183905 90.1784934,36.9975286 90.1784934,36.0516701 C90.1784934,35.1058115 89.9185571,34.3780624 89.3986768,33.8684007 C88.8787965,33.3587391 88.0809053,33.1039121 87.0049791,33.1039121 Z" id="Path-Copy-14" fill="currentColor"></path> </g> </g> </g> </g> </g> </g> </svg></div><div class="custom-js-right-click w-embed w-script"><script> document.addEventListener("DOMContentLoaded", (event) => { const topNavBrand = document.querySelector('.top-nav-brand'); if (!topNavBrand) return topNavBrand.addEventListener('contextmenu', function (ev) { ev.preventDefault(); window.location.href = "/brand-assets" return false; }, false); }); </script></div></a><nav role="navigation" class="top-nav-menu w-nav-menu"><a href="/" class="top-nav-menu-link w-nav-link">Home</a><a href="/react-native" class="top-nav-menu-link w-nav-link">React native</a><a href="/expo" class="top-nav-menu-link w-nav-link">EXPO</a><a href="/work" class="top-nav-menu-link w-nav-link">Work</a><a href="/about" class="top-nav-menu-link w-nav-link">company</a><div data-hover="false" data-delay="400" data-w-id="45f2be38-41d3-ac34-36b4-3d0a0dec342d" class="dropdown w-dropdown"><div class="dropdown-toggle w-dropdown-toggle"><div class="top-nav-menu-link">Community</div></div><nav data-w-id="45f2be38-41d3-ac34-36b4-3d0a0dec3432" class="dropdown-list w-dropdown-list"><a href="/community/building-community" class="top-nav-menu-link w-nav-link">Building community</a><a href="/community/open-source" class="top-nav-menu-link w-nav-link">Open Source</a><a href="/community/podcasts" class="top-nav-menu-link w-nav-link">Podcasts</a><a href="/community/newsletters" class="top-nav-menu-link w-nav-link">Newsletters</a><a href="https://chainreactconf.com/" class="top-nav-menu-link w-nav-link">Chain React Conf</a></nav></div><a id="top-nav-community-dropdown-trigger" href="/community/building-community" class="top-nav-menu-link-w-icon hide-on-mobile w-inline-block"><div class="top-nav-menu-link">Community</div><div data-w-id="c14198b8-6711-9603-8e2b-b484f797fe93" class="icon--sm top-nav-menu-link-icon-caret w-embed"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"> <path stroke="currentColor" stroke-linecap="square" d="m18 10-5.98 5.98L6.03 10"/> </svg></div></a><a href="/contact?source=header" class="top-nav-menu-link w-nav-link">Contact us</a></nav></div><div data-w-id="c14198b8-6711-9603-8e2b-b484f797feb8" class="menu-button w-nav-button"><div class="menu-button-hamburger"><div data-w-id="c14198b8-6711-9603-8e2b-b484f797feba" class="menu-button-hamburger-line"></div><div data-w-id="c14198b8-6711-9603-8e2b-b484f797febc" class="menu-button-hamburger-line"></div><div data-w-id="c14198b8-6711-9603-8e2b-b484f797febb" class="menu-button-hamburger-line"></div></div></div></div><div id="top-nav-community-dropdown" data-w-id="53290218-fbdb-7f81-e737-5e8aa1c5677c" class="top-nav-dropdown hide-on-mobile"><div class="top-nav-wrapper"><div class="div-block-23"></div><div class="top-nav-menu"><a href="/community/building-community" class="top-nav-menu-link in-dropdown w-nav-link">Building community</a><a href="/community/open-source" class="top-nav-menu-link in-dropdown w-nav-link">Open Source</a><a href="/community/podcasts" class="top-nav-menu-link in-dropdown w-nav-link">Podcasts</a><a href="/community/talks" class="top-nav-menu-link in-dropdown w-nav-link">Talks</a><a href="/community/newsletters" class="top-nav-menu-link in-dropdown w-nav-link">Newsletters</a><a href="https://chainreactconf.com/" target="_blank" class="top-nav-menu-link-w-icon w-inline-block"><div class="top-nav-menu-link in-dropdown">Chain React Conf</div><div data-w-id="f15c6ff2-519f-6bb2-96d9-e0d8470998e8" class="icon--sm top-nav-menu-icon-link-external w-embed"><svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M7 17L17 7M17 7H8.53846M17 7V15.4615" stroke="currentColor" stroke-linecap="square" /> </svg></div></a></div></div></div><div class="top-nav-embed w-embed"><style> .top-nav-menu-link-w-icon > .icon--sm + .top-nav-menu-link { padding-left: 8px; padding-right: 0px; } .top-nav-menu-link-w-icon > .top-nav-menu-link:has(+ .icon--sm) { padding-right: 8px; padding-left: 0px; } .top-nav-menu-link-w-icon.w--current > .top-nav-menu-link, .top-nav-menu-link-w-icon.w--current > .icon--sm { color: var(--crimson) !important; } .top-nav .top-nav-menu > .top-nav-menu-link:hover, .top-nav .top-nav-menu > .top-nav-menu-link-w-icon:hover { opacity: 0.65; transition: opacity 200ms ease-in-out; } .top-nav:has(#top-nav-community-dropdown .w--current) #top-nav-community-dropdown { opacity: 1 !important; pointer-events: auto !important; } .top-nav #top-nav-community-dropdown { opacity: 0; transition: opacity 350ms ease-in-out 500ms; } .top-nav #top-nav-community-dropdown:not(.active) { pointer-events: none; } .top-nav:has(#top-nav-community-dropdown-trigger:hover) #top-nav-community-dropdown, .top-nav:has(#top-nav-community-dropdown:hover) #top-nav-community-dropdown { opacity: 1; transition-delay: 100ms; pointer-events: auto; } .top-nav .top-nav-brand-image { transition: color 350ms ease-in-out; } .top-nav:has(.menu-button.w--open) .top-nav-brand-image { color: var(--dark-slate) !important; } .top-nav:has(.menu-button.w--open) .nav-icon__bar, .top-nav:has(.menu-button.w--open) .menu-button-hamburger-line{ background: var(--dark-slate) !important; } .top-nav .nav-icon__bar, .top-nav .menu-button-hamburger-line { transition: background 350ms ease-in-out; } .top-nav:has(#top-nav-community-dropdown .w--current) #top-nav-community-dropdown-trigger * { color: var(--crimson) !important; } @media screen and (max-width: 991px) { .top-nav-menu-link { color: var(--dark-slate) !important; } .top-nav-menu-link.w--current { color: var(--crimson) !important; } } .nav-on-white .top-nav .top-nav-menu-link, .nav-on-white .top-nav .top-nav-brand-image, .nav-on-white .top-nav .icon--sm { color: var(--dark-slate); } .nav-on-white .top-nav .menu-button-hamburger-line { background: var(--dark-slate); } .nav-on-white .top-nav { background: rgba(255, 255, 255, 0.96); } .nav-on-white .top-nav .top-nav-dropdown { border-color: rgba(25, 16, 21, 0.1); background: rgba(255, 255, 255, 0.96); } </style></div><div class="top-nav-embed w-embed w-script"><script> const dropdownTargets = document.querySelectorAll("#top-nav-community-dropdown-trigger, #top-nav-community-dropdown") const dropdown = document.querySelector("#top-nav-community-dropdown") dropdownTargets.forEach(target => { let inactiveTimeout target.addEventListener("mouseover", ()=>{ clearTimeout(inactiveTimeout) dropdown.classList.add("active") }) target.addEventListener("mouseleave", ()=> { inactiveTimeout = setTimeout(()=>{ dropdown.classList.remove("active") },1500) }) }) </script></div></div><div class="hero-sub hero-img--team"><div class="container"><div class="hero-sub__content-animation"><h1 class="h1--reversed h1--flex">United by</h1><h1 data-w-id="72ad4f42-2240-d9fb-490d-7b5b7cc2e938" style="-webkit-transform:translate3d(0, -24PX, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0, -24PX, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0, -24PX, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0, -24PX, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0)" class="h1--reversed h1--animation h1--animation-first">values</h1><h1 data-w-id="6476311d-605d-3fca-37fd-12a3c4fab8f2" style="-webkit-transform:translate3d(0, -24PX, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0, -24PX, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0, -24PX, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0, -24PX, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0)" class="h1--reversed h1--animation">dedication</h1><h1 data-w-id="329a9ebd-7fd7-6d28-a208-765a5ca8bbf5" style="-webkit-transform:translate3d(0, -24PX, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0, -24PX, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0, -24PX, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0, -24PX, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0)" class="h1--reversed h1--animation">possibility</h1><h1 data-w-id="e6608880-80d0-0f56-b093-91a3936a5aee" style="-webkit-transform:translate3d(0, -24PX, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0, -24PX, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0, -24PX, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0, -24PX, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0)" class="h1--reversed h1--animation">design</h1><h1 class="h1--reversed h1--flex">, </h1><h1 class="h1--reversed h1--flex spacing--left"> not by location</h1></div></div></div><div class="sub-intro"><div class="container"><div class="section-intro"><h2>Life at Infinite Red</h2><p>Remote work allows us to assemble the right team with the right people regardless of location. The Infinite Red team currently consists of 25 people in 8 states, each contributing a unique skillset and outlook. Oh, and there’s also our traveling nomad in a van somewhere (oh hi, Mark!).</p></div></div></div><div class="map"><div class="container"><div class="team-members-data w-dyn-list"><div role="list" class="collection-list w-dyn-items"><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Tyler Williams", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/670ff13086008302c94f6a0b_tyler-sarah-elopement-larsenphotoco-459.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ , ], "type": "Point" }, "id": "tyler-williams" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Justin Poliachik", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/6595e8cc45dc925544b8051e_image.png", "currentEmployee": true }, "geometry": { "coordinates": [ , ], "type": "Point" }, "id": "justin-poliachik" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Nick Morgan", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa581fdbb70de9a8fb93f_20231026_15-40-19.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ , ], "type": "Point" }, "id": "nick-morgan" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Ryan Linton", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa61a9da51b1870adfe1e_20231026_15-45-26.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ , ], "type": "Point" }, "id": "ryan-linton" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Felipe Peña", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66e086225aa5021fde99b519_felipe.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ , ], "type": "Point" }, "id": "felipe-pena" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Joshua Yoes", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa69fbdc752cad613da77_20231026_15-47-35.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ , ], "type": "Point" }, "id": "joshua-yoes" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Dan Edwards", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa68de610bf8a12d1f809_20231026_15-47-04.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ , ], "type": "Point" }, "id": "dan-edwards" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Frank Calise", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa6802d6df542be832879_20231026_15-46-50.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ , ], "type": "Point" }, "id": "frank-calise" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Trevor Coleman ", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa5cbe610bf8a12d11133_20231026_15-43-20%202.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ 85.3232, 51.2538 ], "type": "Point" }, "id": "trevor-coleman" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Simran Kaur", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/647fa76eac4a9d945e899925_Simran560-2%20(1).jpg", "currentEmployee": false }, "geometry": { "coordinates": [ 51.2538, 85.3232 ], "type": "Point" }, "id": "simran-kaur" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Lizzi Lindboe", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa6ac45188bf0852ea734_20231026_15-47-50%202.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ , ], "type": "Point" }, "id": "lizzi-lindboe" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Kate Kim", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa6ba387508cfbb61611d_20231026_15-48-12.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ , ], "type": "Point" }, "id": "kate-kim" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Mazen Chami", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa5f76ad9609544661475_20231026_15-44-41.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ , ], "type": "Point" }, "id": "mazen-chami" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Cali", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/647fa962ac4a9d945e8b53d5_cali-2%201.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ , ], "type": "Point" }, "id": "cali" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Harris Robin Kalash", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/647fab0fcabdd676c412bdbe_harris-11%20(1).jpg", "currentEmployee": false }, "geometry": { "coordinates": [ , ], "type": "Point" }, "id": "harris-robin-kalash" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Jon Major Condon", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa6f21845dce60cf444b6_20231026_15-49-21.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ , ], "type": "Point" }, "id": "jon-major-condon" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Carlin Isaacson", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa62844f2630e785d5018_20231026_15-45-59.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ -122.621954, 45.628570 ], "type": "Point" }, "id": "carlin-isaacson" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Robin Heinze", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cf7369dd49e760b2a1788e_20231026_15-42-48.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ -122.802536, 45.481861 ], "type": "Point" }, "id": "robin-heinze" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Missy Warren", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/60555a2d8ad46310f01a6708_Missy-square-280px.jpg", "currentEmployee": false }, "geometry": { "coordinates": [ -119.813800, 39.529600 ], "type": "Point" }, "id": "missy-warren" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Silas Matson", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/605559db5e94b1f11b69e0c2_Silas-square-280px.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ -119.092200, 46.230500 ], "type": "Point" }, "id": "silas-matson" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Frank von Hoven", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/5eb43a1fb21f572bdcdec180_Frank%20von%20Hoven.jpg", "currentEmployee": false }, "geometry": { "coordinates": [ -90.051357, 29.947265 ], "type": "Point" }, "id": "frank-von-hoven" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Leon Kim", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa5ba707e0896dd3727b7_20231026_15-42-25.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ 128.57246, 35.859767 ], "type": "Point" }, "id": "leon-kim" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Kevin Vangelder", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/60556748590b8c20d27ec934_Kevin-square-280px.jpg", "currentEmployee": false }, "geometry": { "coordinates": [ -122.641504, 45.635389 ], "type": "Point" }, "id": "kevin-vangelder" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Mark Rickert", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa606e610bf8a12d16560_20231026_15-44-57.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ -109.549800, 32.803191 ], "type": "Point" }, "id": "mark-rickert" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Yulian Glukhenko", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa5ab6ef2a4e3cbacc600_20231026_15-41-56.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ -122.657689, 45.657293 ], "type": "Point" }, "id": "yulian-glukhenko" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Derek Greenberg", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa6d380e7693dbf56e5f4_20231026_15-48-33.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ -122.411983, 37.706632 ], "type": "Point" }, "id": "derek-greenberg" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Bryan Stearns", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa65e9e324a8045fecb45_20231026_15-46-22.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ -122.620781, 45.535568 ], "type": "Point" }, "id": "bryan-stearns" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Darin Wilson", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa66e688544d78baa23c5_20231026_15-46-37.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ -122.44649, 37.770544 ], "type": "Point" }, "id": "darin-wilson" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Jenna Fucci", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/647faa3e04eaefae6f18d6f1_jenna.jpg", "currentEmployee": false }, "geometry": { "coordinates": [ -104.891362, 39.746630 ], "type": "Point" }, "id": "jenna-fucci" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Shawni Danner", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/6055673a72a8dc7a915ea58b_Shawni-square-280px.jpg", "currentEmployee": false }, "geometry": { "coordinates": [ -117.234807, 32.803191 ], "type": "Point" }, "id": "shawni-danner" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Jed Bartausky", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cf73841901e56a45045007_20231026_15-44-10.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ -119.487800, 46.263200 ], "type": "Point" }, "id": "jed-bartausky" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Justin Huskey", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa64f8b1c0f7ca92735c7_20231026_15-46-10.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ -122.662734, 45.621184 ], "type": "Point" }, "id": "justin-huskey" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Todd Werth", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa6e239892434bece2353_20231026_15-48-54.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ -115.303885, 36.314615 ], "type": "Point" }, "id": "todd-werth" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Jamon Holmgren", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/647f5b6b9be2d0032655022b_jamon%20(1).jpg", "currentEmployee": true }, "geometry": { "coordinates": [ -122.711786, 45.579531 ], "type": "Point" }, "id": "jamon-holmgren" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Gant Laborde", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa5e759021ab6cc7b7eed_20231026_15-43-43.jpg", "currentEmployee": true }, "geometry": { "coordinates": [ -90.130621, 29.935140 ], "type": "Point" }, "id": "gant-laborde" } ) </script></div></div><div role="listitem" class="collection-item w-dyn-item"><div class="w-embed w-script"><script> window.teamMembersFeatures = window.teamMembersFeatures || [] window.teamMembersFeatures.push( { "type": "Feature", "properties": { "name": "Cindy Nguyen", "avatar": "https://cdn.prod.website-files.com/5e696c156810060ef59d768e/5eb43ac592efe329d95aea27_cindy.jpg", "currentEmployee": false }, "geometry": { "coordinates": [ , ], "type": "Point" }, "id": "cindy-nguyen" } ) </script></div></div></div></div><div id="dynamic-map-container" class="dynamic-map"><div class="html-embed-2 w-embed w-script"><div id="dynamic-map"></div> <style> #dynamic-map-container { position: relative; padding-bottom: 65%; display: block; } #dynamic-map { width: 100% !important; height: 100% !important; position: absolute; top: 0; left: 0; } #dynamic-map .mapboxgl-ctrl-bottom-left { display: none !important; } #dynamic-map .mapboxgl-popup-close-button { display: none; } #dynamic-map .mapboxgl-popup-content { padding: 14px 30px; -webkit-box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1); } #dynamic-map .remote-work-map-popup { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #dynamic-map .remote-work-map-popup .remote-work-map-popup-image { display: block; width: 33px; height: 33px; background-size: cover; background-repeat: no-repeat; background-position: center center; } #dynamic-map .remote-work-map-popup .remote-work-map-popup-name { font-weight: bold; font-size: 13px; color: #4c3d54; letter-spacing: 1px; margin-right: 18px; margin-bottom: 0px; } </style> <script> // Config var mapboxConfig = { accessToken: 'pk.eyJ1Ijoiamh1c2tleSIsImEiOiJjamFicHEyYmowMmh4MzNwbGJsMHFmNHhoIn0._2iDBeHi7lUMHWUEdTFrqA', featureCollection: { "type": "FeatureCollection", "features": window.teamMembersFeatures.filter(f => f.properties.currentEmployee) }, clusterRadius: 20, map: null, } mapboxgl.accessToken = mapboxConfig.accessToken // Load Map var loadMap = function () { mapboxConfig.map = new mapboxgl.Map({ container: 'dynamic-map', style: 'mapbox://styles/jhuskey/cji2uujhr11282slmq61d3794', center: [-98.242, 39.367], zoom: 3.1, scrollZoom: false, attributionControl: false }) mapboxConfig.map.addControl(new mapboxgl.NavigationControl(), 'top-left') } var onMapPointClick = function () { mapboxConfig.map.on('click', 'points', (e) => { const points = mapboxConfig.map.queryRenderedFeatures(e.point, { layers: ['points'] }) if (!points.length) return const point = points[0] new mapboxgl.Popup({ offset: [15, 0], closeOnClick: true, closeButtom: false, anchor: 'left' }) .setLngLat(point.geometry.coordinates) .setHTML(` <div class='remote-work-map-popup'> <span class='remote-work-map-popup-name'>${point.properties.name ? point.properties.name : 'Set Name in Mapbox'}</span> <span class='remote-work-map-popup-image' style="background-image: url(${point.properties.avatar});"></span> </div> `) .setLngLat(point.geometry.coordinates) .addTo(mapboxConfig.map) }) } var onMapClusterClick = function () { mapboxConfig.map.on('click', 'clusters', (e) => { const cluster = mapboxConfig.map.queryRenderedFeatures(e.point, { layers: ['clusters'] }) if (!cluster.length) return // find points in cluster const pointsInCluster = mapboxConfig.featureCollection.features.filter(f => { const pointPixels = mapboxConfig.map.project(f.geometry.coordinates) const pixelDistance = Math.sqrt( Math.pow(e.point.x - pointPixels.x, 2) + Math.pow(e.point.y - pointPixels.y, 2) ) return Math.abs(pixelDistance) <= mapboxConfig.clusterRadius }) let newBounds = new mapboxgl.LngLatBounds() pointsInCluster.forEach(function (feature) { newBounds.extend(feature.geometry.coordinates) }) mapboxConfig.map.fitBounds(newBounds, { padding: 250 }) }) } var onMapLoad = function () { mapboxConfig.map.on('load', () => { mapboxConfig.map.addSource('employee-locations', { type: 'geojson', data: mapboxConfig.featureCollection, cluster: true, clusterMaxZoom: 5, clusterRadius: mapboxConfig.clusterRadius }) mapboxConfig.map.addLayer({ id: 'clusters', type: 'symbol', source: 'employee-locations', filter: ['has', 'point_count'], layout: { 'icon-allow-overlap': true, 'icon-image': 'pin.remote-work' } }) mapboxConfig.map.addLayer({ id: 'points', type: 'symbol', source: 'employee-locations', filter: ['!has', 'point_count'], layout: { 'icon-allow-overlap': true, 'icon-image': 'pin.remote-work' } }) onMapPointClick() onMapClusterClick() }) } // Init Map loadMap() onMapLoad() </script></div></div></div></div><div class="map-static"><div class="container"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5eaa0dc847077a548c79ae80_1v5vvxidkr-map-mobile2x.png" sizes="(max-width: 640px) 100vw, 640px" srcset="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5eaa0dc847077a548c79ae80_1v5vvxidkr-map-mobile2x-p-500.png 500w, https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5eaa0dc847077a548c79ae80_1v5vvxidkr-map-mobile2x.png 640w" alt="" class="static-map"/></div></div><div class="sub-intro"><div class="container"><div class="section-intro"><p>Our company culture—fun, supportive, connected—is core to making us who we are. We meet up on video calls (and actually enjoy them!), hold bi-weekly guild meetings, and play games during lunchtime. Most of our meetups happen virtually, but we all get together in person at least once a year at our “all treat” (all team retreat).</p></div></div></div><div class="photos"><div class="container"><div data-delay="4000" data-animation="slide" class="photos__slider w-slider" data-autoplay="false" data-easing="ease" data-hide-arrows="false" data-disable-swipe="false" data-autoplay-limit="0" data-nav-spacing="3" data-duration="500" data-infinite="true"><div class="photos__slider__mask w-slider-mask"><div class="photos__slider__slide1 w-slide"><div class="photos__slider__slide__img1"></div></div><div class="photos__slider__slide1 w-slide"><div class="photos__slider__slide__img2"></div></div><div class="photos__slider__slide1 w-slide"><div class="photos__slider__slide__img3"></div></div><div class="photos__slider__slide1 w-slide"><div class="photos__slider__slide__img4"></div></div><div class="photos__slider__slide1 w-slide"><div class="photos__slider__slide__img5"></div></div></div><div class="previousbutton w-slider-arrow-left"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5e6adcce03eb1a028fffb55b_circle-arrow-left.svg" alt="Left Arrow" class="image"/></div><div class="nextbutton w-slider-arrow-right"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5e6adcce03eb1a6378ffb55c_circle-arrow-right.svg" alt="Right Arrow" class="image-2"/></div><div class="work-list__slider__nav w-slider-nav w-slider-nav-invert w-round"></div></div></div></div><div class="sub-intro"><div class="container"><div class="section-intro"><h2>Connected through community</h2><p>Fostering community is a core value of Infinite Red—it’s just that our community is location independent! We participate in the wider tech world through remote tools for collaboration.We give back through our <a href="https://github.com/infinitered" target="_blank">open-source projects</a>, <a href="https://community.infinite.red" target="_blank">community slack</a>, and <a href="https://cr.infinite.red" target="_blank">conference</a>.</p><div class="section-intro__anchors"><a href="#tools" class="anchor w-inline-block"><h5>Tools we use</h5><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5ea8b52e0db6d1e88791504b_i-arrow-down.svg" alt="" class="anchor__icon"/></a><a href="#blog" class="anchor w-inline-block"><h5>Our Blog</h5><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5ea8b52e0db6d1e88791504b_i-arrow-down.svg" alt="" class="anchor__icon"/></a><a href="#events" class="anchor w-inline-block"><h5>Upcoming events</h5><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5ea8b52e0db6d1e88791504b_i-arrow-down.svg" alt="" class="anchor__icon"/></a></div></div></div></div><div id="tools" class="tools"><div class="container"><div class="section-intro"><h2>Tools for remote communication and collaboration</h2><p>Even though our teammates aren’t in the same room (and sometimes might not even be on the same continent!), we value real-time collaboration. Here are the tried-and-true tools that help us achieve a cohesive remote team workflow.</p></div><div class="col-icon col-icon--white col-icon--sm-padding"><div class="col-icon-4 w-row"><div class="col-icon__col w-col w-col-3"><div class="col-icon__heading col-icon__heading--left"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5ea8ba690db6d181a4917eef_slack.svg" alt="Slack logo" class="col-icon__col__icon icon--logo"/></div><p>'Virtual' office for text-based communication with coworkers.</p></div><div class="col-icon__col w-col w-col-3"><div class="col-icon__heading col-icon__heading--left"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5ea8ba2c4488c245e4415f93_zoom.svg" alt="Zoom logo" class="col-icon__col__icon icon--logo"/></div><p>Video conferences for internal and client meetings.</p></div><div class="col-icon__col w-col w-col-3"><div class="col-icon__heading col-icon__heading--left"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5ea8b96cafc9df5dccf1c145_loom.svg" alt="Loom logo" class="col-icon__col__icon icon--logo"/></div><p>Screen recording for asynchronous updates.</p></div><div class="col-icon__col w-col w-col-3"><div class="col-icon__heading col-icon__heading--left"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5ea8baf73bda8c106fbb6ef6_trello.svg" alt="Trello logo" class="col-icon__col__icon icon--logo"/></div><p>Project management in a simple list format. Everyone loves lists.</p></div></div></div><div class="col-icon col-icon--white col-icon--sm-padding"><div class="col-icon-4 w-row"><div class="col-icon__col w-col w-col-3"><div class="col-icon__heading col-icon__heading--left"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5ea8bb33091ab47805638c27_g-suite.svg" alt="G Suite logo" class="col-icon__col__icon icon--logo"/></div><p>All-in-one package for storing and sharing files.</p></div><div class="col-icon__col w-col w-col-3"><div class="col-icon__heading col-icon__heading--left"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5ea8bb3e30c7f0fee23b9ab2_github.svg" alt="Github logo" class="col-icon__col__icon icon--logo"/></div><p>Dev platform for pushing code and sharing open source.</p></div><div class="col-icon__col w-col w-col-3"><div class="col-icon__heading col-icon__heading--left"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5ea8bb4cafc9dffb06f1cc3c_invision.svg" alt="Invision logo" class="col-icon__col__icon icon--logo"/></div><p>Design prototyping platform for collaboration and feedback.</p></div><div class="col-icon__col w-col w-col-3"><div class="col-icon__heading col-icon__heading--left"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5ea8bb7eecdbea55c06460c2_miro.svg" alt="Miro logo" class="col-icon__col__icon icon--logo"/></div><p>Digital whiteboard for realtime brainstorming and collaboration.</p></div></div></div></div></div><div class="testimonial"><div class="container"><div class="testimonial__quote"><p class="p--quote">"We at Infinite Red strongly feel that working remote is better, not perfect. It's something we journey into every day. Over-communicate, be disciplined, and be considerate to your team. Then you can reap the benefits of remote work."</p><div class="w-dyn-list"><div role="list" class="w-dyn-items"><div role="listitem" class="testimonial__collection__item w-dyn-item"><div style="background-image:url("https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa5e759021ab6cc7b7eed_20231026_15-43-43.jpg")" class="testimonial__img"></div><h4 class="testimonial__collection__item__name">Gant Laborde</h4><h6 class="testimonail__collection__item__title">Owner & Chief Innovation Officer</h6></div></div></div></div></div></div><div id="blog" class="blog"><div class="container"><div class="section-intro"><h2>Thoughts from the team</h2><p>Our blog, Red Shift, offers a little bit of everything. You'll find everything from posts about some of our remote lifestyles, and how-tos in React Native, to our thoughts on implementing design into your everyday process.</p></div><div class="blog__list"><a data-w-id="641bb2c8-56c8-b457-9fa7-4362eae24f80" href="https://shift.infinite.red/the-secret-to-react-natives-success-b7317319d34d" target="_blank" class="blog-list__card w-inline-block"><div class="blog-list__card__img blog-list__card__img1"></div><div class="blog-list__card__content"><h4>The secret to React Native's success</h4><div class="blog-list__card__content__author"><h5>Jamon Holmgren</h5></div><div class="work-list__project__card__icon arrow--external"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5e6fe919bfeebf469720b8e3_arrow-r.svg" alt="arrow pointing right" width="256"/></div></div></a><a data-w-id="641bb2c8-56c8-b457-9fa7-4362eae24f8a" href="https://shift.infinite.red/react-native-radio-fake-news-4451885bac9c" target="_blank" class="blog-list__card w-inline-block"><div class="blog-list__card__img blog-list__card__img2"></div><div class="blog-list__card__content"><h4 class="card-heading">React Native Radio fake news</h4><div class="blog-list__card__content__author"><h5>Gant Laborde</h5></div><div class="work-list__project__card__icon arrow--external"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5e6fe919bfeebf469720b8e3_arrow-r.svg" alt="arrow pointing right" width="256"/></div></div></a><a data-w-id="641bb2c8-56c8-b457-9fa7-4362eae24f94" href="https://shift.infinite.red/getting-the-most-from-github-copilot-8f7b32014748" target="_blank" class="blog-list__card w-inline-block"><div class="blog-list__card__img blog-list__card__img3"></div><div class="blog-list__card__content"><h4 class="blog-list__card__title">Getting the most from Github copilot</h4><div class="blog-list__card__content__author"><h5>Jamon Holmgren</h5></div><div class="work-list__project__card__icon arrow--external"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5e6fe919bfeebf469720b8e3_arrow-r.svg" alt="arrow pointing right" width="256"/></div></div></a></div><a href="https://shift.infinite.red" target="_blank" class="bttn bttn--outlined w-button">Read more on the blog</a></div></div><div id="events" class="grid-overview"><div class="container"><div class="grid-overview__content"><h3>Talks + Events</h3><p>Our team speaks at and attends conferences all over the world. We even created one ourselves! Sync up with us in real life at these upcoming events, or invite us to yours!</p><a href="/community/talks" class="bttn bttn--outlined bttn--spacing-top-lg w-button">View talks + upcoming events</a><div class="grid-overview__content__callout"><p>Interested in having an Infinite Red team member speak at your event? Send us an email with a few details about your event.</p><a href="mailto:hello@infinite.red?subject=Speaking%20Inquiry" class="link-arrow w-inline-block"><div class="link--icon">Email Us</div><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5e6fe919bfeebf469720b8e3_arrow-r.svg" alt="arrow" width="256" class="link-arrow__icon"/></a></div></div></div><div class="grid-overview__img grid__img--events"></div></div><div class="grid-overview"><div class="container w-clearfix"><div class="grid-overview__content-r"><h3>Chain React Conference</h3><p>What do you do when the conference you want doesn’t exist? Create it, of course!<br/><br/>The Chain React Conference was started in 2017 by the team at Infinite Red, who wanted nothing more than to learn from other React Native enthusiasts, eat great food, and nerd out about redux vs mob-x. The conference was a great success and has become a yearly event attended by React Native gurus and newbies alike.<br/></p><a href="https://cr.infinite.red" target="_blank" class="bttn bttn--outlined bttn--spacing-top-lg w-button">More about Chain React</a></div></div><div class="grid-overview__img-left grid__img-conferences"></div></div><div class="team-owners"><div class="container"><div class="section-intro"><h2>What started it all</h2><p>Technology has changed the world in countless ways. Why shouldn’t it change the way we work? When Todd, Ken, and Jamon created Infinite Red, they were dedicated to building absolutely the best team possible: in experience, talent, skill, and the ability to work together as more than the sum of its parts. To find out more about Infinite Red’s philosophy and history, check out our podcast with the founders.</p><div class="section-intro__quote"><p class="p--quote">“We didn’t start Infinite Red as a shortcut to wealth by selling out to a bigger company. We are in it for the long run. Infinite Red was created to be a sustainable team of experts in their fields, with a culture that values our people like family. To that end, we grow our team slowly and purposefully, ensuring that we’re making the right choices along the way.”</p><h5 class="quote__names">— TODD, Jamon + Gant, owners OF INFINITE RED</h5></div></div><div class="design-team__profiles"><div class="profile-large__collection-wrapper w-dyn-list"><div role="list" class="profile-large__collection w-dyn-items"><div role="listitem" class="profile-large__collection__item w-dyn-item"><div style="background-image:url("https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa6e239892434bece2353_20231026_15-48-54.jpg")" class="profile-large__image"></div><div class="profile-large__info"><h5 class="team__info__text">Todd Werth</h5><h5 class="profile-large__info__spacer">,</h5><h5 class="team__info__text">Owner & Chief Executive Officer</h5></div><div class="team__list__bio__social"><a href="http://www.twitter.com/twerth" target="_blank" class="team__social__icon w-inline-block"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5e7a57f47ccf83a96333fd4d_icon-twitter.svg" alt="Twitter icon" class="team__social__icon__img"/></a><a href="http://www.github.com/twerth" target="_blank" class="team__social__icon w-inline-block"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5e7a594e5ee481703b2c3af4_icon-github.svg" alt="Github icon" class="team__social__icon__img"/></a><a href="https://www.linkedin.com/in/toddwerth" target="_blank" class="team__social__icon w-inline-block"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5e7a591bc5036883b46dc336_icon-linkedin.svg" alt="LinkedIn icon" class="team__social__icon__img"/></a></div></div><div role="listitem" class="profile-large__collection__item w-dyn-item"><div style="background-image:url("https://cdn.prod.website-files.com/5e696c156810060ef59d768e/647f5b6b9be2d0032655022b_jamon%20(1).jpg")" class="profile-large__image"></div><div class="profile-large__info"><h5 class="team__info__text">Jamon Holmgren</h5><h5 class="profile-large__info__spacer">,</h5><h5 class="team__info__text">Owner & Chief Technology Officer</h5></div><div class="team__list__bio__social"><a href="http://twitter.com/jamonholmgren" target="_blank" class="team__social__icon w-inline-block"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5e7a57f47ccf83a96333fd4d_icon-twitter.svg" alt="Twitter icon" class="team__social__icon__img"/></a><a href="http://www.github.com/jamonholmgren" target="_blank" class="team__social__icon w-inline-block"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5e7a594e5ee481703b2c3af4_icon-github.svg" alt="Github icon" class="team__social__icon__img"/></a><a href="https://www.linkedin.com/in/jamonholmgren" target="_blank" class="team__social__icon w-inline-block"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5e7a591bc5036883b46dc336_icon-linkedin.svg" alt="LinkedIn icon" class="team__social__icon__img"/></a></div></div><div role="listitem" class="profile-large__collection__item w-dyn-item"><div style="background-image:url("https://cdn.prod.website-files.com/5e696c156810060ef59d768e/66cfa5e759021ab6cc7b7eed_20231026_15-43-43.jpg")" class="profile-large__image"></div><div class="profile-large__info"><h5 class="team__info__text">Gant Laborde</h5><h5 class="profile-large__info__spacer">,</h5><h5 class="team__info__text">Owner & Chief Innovation Officer</h5></div><div class="team__list__bio__social"><a href="http://www.twitter.com/GantLaborde" target="_blank" class="team__social__icon w-inline-block"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5e7a57f47ccf83a96333fd4d_icon-twitter.svg" alt="Twitter icon" class="team__social__icon__img"/></a><a href="http://www.github.com/GantMan" target="_blank" class="team__social__icon w-inline-block"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5e7a594e5ee481703b2c3af4_icon-github.svg" alt="Github icon" class="team__social__icon__img"/></a><a href="https://www.linkedin.com/in/gant-laborde/" target="_blank" class="team__social__icon w-inline-block"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5e7a591bc5036883b46dc336_icon-linkedin.svg" alt="LinkedIn icon" class="team__social__icon__img"/></a></div></div></div></div></div></div></div><div class="bottom-cta"><section class="bottom-cta-v2"><div class="bottom-cta-tiled-background-1"><div class="bottom-cta-tiled-background-tiles"></div></div><div class="bottom-cta-tiled-background-2"><div class="bottom-cta-tiled-background-tiles"></div></div><div class="bottom-cta-tiled-background-3"><div class="bottom-cta-tiled-background-tiles"></div></div><div class="bottom-cta-tiled-background-4"><div class="bottom-cta-tiled-background-tiles"></div></div><div class="bottom-cta-tiled-background-5"><div class="bottom-cta-tiled-background-tiles"></div></div><div class="bottom-cta-tiled-background-6"><div class="bottom-cta-tiled-background-tiles"></div></div><div class="bottom-cta-container"><div class="bottom-cta-wrapper"><div class="bottom-cta-photos"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/62b24b1c6142faefea33129d_gallery1.jpg" loading="lazy" sizes="(max-width: 548px) 100vw, 548px" srcset="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/62b24b1c6142faefea33129d_gallery1-p-500.jpeg 500w, https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/62b24b1c6142faefea33129d_gallery1.jpg 548w" alt="Photo of Gant Laborde and Mark Rickert hugging at a retreat." class="bottom-cta-img-1"/><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/62b24b1c61412c535c84c3ce_gallery3.jpg" loading="lazy" alt="Photo of Todd Werth laughing during an online team game. Other members of the team are in the background." class="bottom-cta-img-2"/><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/62b24b1c07c14e85165e2349_gallery2.jpg" loading="lazy" sizes="(max-width: 728px) 100vw, 728px" srcset="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/62b24b1c07c14e85165e2349_gallery2-p-500.jpeg 500w, https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/62b24b1c07c14e85165e2349_gallery2.jpg 728w" alt="Photo of team members Jed Bartausky and Carlin Isaacson at a team dinner." class="bottom-cta-img-3"/><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/62b24b1b809b2c0025532a9a_gallery7.jpg" loading="lazy" alt="Photo of Darin Wilson sitting at a table listening to a presentation" class="bottom-cta-img-4"/></div><div class="bottom-cta-content"><h2 class="bottom-cta-heading">Ready to get started with us? Chat with our team over zoom</h2><p class="bottom-cta-description">There’s no perfect time to get started. Whether you have a formal proposal or a few napkin sketches, we’re always happy to chat about your project at any stage of the process.</p><a href="/contact?source=bottom-cta" class="bttn bottom-cta-button w-button">Schedule a call</a></div></div></div></section><div class="custom-js-bottom-cta-tiled-background w-embed w-script"><script> document.addEventListener("DOMContentLoaded", (event) => { gsap_tiledBackground('.bottom-cta-tiled-background-1', '.bottom-cta-tiled-background-tiles') gsap_tiledBackground('.bottom-cta-tiled-background-2', '.bottom-cta-tiled-background-tiles') gsap_tiledBackground('.bottom-cta-tiled-background-3', '.bottom-cta-tiled-background-tiles') gsap_tiledBackground('.bottom-cta-tiled-background-4', '.bottom-cta-tiled-background-tiles') gsap_tiledBackground('.bottom-cta-tiled-background-5', '.bottom-cta-tiled-background-tiles') gsap_tiledBackground('.bottom-cta-tiled-background-6', '.bottom-cta-tiled-background-tiles') }); </script></div></div><div class="footer"><section class="footer-v2"><div class="footer-tiled-background-1"><div class="footer-tiled-background-tiles"></div></div><div class="footer-tiled-background-2"><div class="footer-tiled-background-tiles"></div></div><div class="footer-tiled-background-3"><div class="footer-tiled-background-tiles"></div></div><div class="footer-tiled-background-4"><div class="footer-tiled-background-tiles"></div></div><div class="footer-container"><div class="footer-nav"><a href="/" class="footer-nav-logo-link w-inline-block"><div class="footer-nav-logo w-embed"><?xml version="1.0" encoding="UTF-8"?> <svg viewBox="0 0 93 41" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">  <title>logo-dark</title> <desc>Created with Sketch.</desc> <g id="Navigation" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="Navigation/Top-Nav/-Transparent" transform="translate(-128.000000, -35.000000)"> <g id="Main-Nav"> <rect id="bounds" x="0" y="0" width="1440" height="111"></rect> <g id="Group" transform="translate(128.000000, 35.000000)"> <g id=".nav__logo--light"> <g id="IR-Logo"> <path d="M36.0800073,0.0610119048 C42.9412217,0.0610119048 48.5033343,5.70727865 48.5033343,12.6723024 C48.5033343,19.6373262 42.9412217,25.283593 36.0800073,25.283593 C29.2187929,25.283593 23.6566802,19.6373262 23.6566802,12.6723024 C23.6566802,5.70727865 29.2187929,0.0610119048 36.0800073,0.0610119048 Z M36.0800073,6.05258288 C32.4785269,6.05258288 29.5589506,9.0163321 29.5589506,12.6723024 C29.5589506,16.3282728 32.4785269,19.292022 36.0800073,19.292022 C39.6814876,19.292022 42.601064,16.3282728 42.601064,12.6723024 C42.601064,9.0163321 39.6814876,6.05258288 36.0800073,6.05258288 Z" id="infinity-left-circle" fill="#E73536"></path> <path d="M56.166766,0.0610119048 C63.0279804,0.0610119048 68.590093,5.70727865 68.590093,12.6723024 C68.590093,19.6373262 63.0279804,25.283593 56.166766,25.283593 C52.9181748,25.283593 49.9608105,24.0178383 47.7471521,21.9456543 C49.0744843,20.2188082 50.035948,18.189109 50.5152955,15.9759446 C51.640891,17.9578044 53.7503391,19.292022 56.166766,19.292022 C59.7682463,19.292022 62.6878227,16.3282728 62.6878227,12.6723024 C62.6878227,9.0163321 59.7682463,6.05258288 56.166766,6.05258288 C53.7340603,6.05258288 51.6124835,7.40483749 50.4916749,9.40927321 C49.997631,7.20099506 49.0222034,5.17810314 47.6836756,3.46012579 C49.9032037,1.35155427 52.8865199,0.0610119048 56.166766,0.0610119048 Z" id="infinity-right-circle" fill="#E73536"></path> <polygon id="Path-Copy-2" fill="currentColor" points="58.9649039 31.2751639 58.9649039 33.1898292 54.2453185 33.1898292 54.2453185 35.1733672 58.4902329 35.1733672 58.4902329 37.005385 54.2453185 37.005385 54.2453185 39.0026977 59.1140862 39.0026977 59.1140862 40.9035883 52.1296423 40.9035883 52.1296423 31.2751639"></polygon> <polygon id="Path-Copy-3" fill="currentColor" points="47.8422083 33.1347309 47.8422083 40.9035883 45.726532 40.9035883 45.726532 33.1347309 43.0412507 33.1347309 43.0412507 31.2751639 50.5274896 31.2751639 50.5274896 33.1347309"></polygon> <polygon id="Path-Copy-4" fill="currentColor" points="39.3544503 31.2751639 41.4701265 31.2751639 41.4701265 40.9035883 39.3544503 40.9035883"></polygon> <polygon id="Path-Copy-5" fill="currentColor" points="34.9258805 31.2751639 37.0415567 31.2751639 37.0415567 40.9035883 34.9258805 40.9035883 30.4097255 34.8703267 30.4097255 40.9035883 28.2940493 40.9035883 28.2940493 31.2751639 30.2741052 31.2751639 34.9258805 37.4737204"></polygon> <polygon id="Path-Copy-6" fill="currentColor" points="23.835593 31.2751639 25.9512692 31.2751639 25.9512692 40.9035883 23.835593 40.9035883"></polygon> <polygon id="Path-Copy-7" fill="currentColor" points="22.1143698 31.2751639 22.1143698 33.16228 17.7202731 33.16228 17.7202731 35.2422401 21.8973774 35.2422401 21.8973774 37.1293561 17.7202731 37.1293561 17.7202731 40.9035883 15.6045969 40.9035883 15.6045969 31.2751639"></polygon> <polygon id="Path-Copy-8" fill="currentColor" points="11.0902875 31.2751639 13.2059637 31.2751639 13.2059637 40.9035883 11.0902875 40.9035883 6.57413246 34.8703267 6.57413246 40.9035883 4.45845625 40.9035883 4.45845625 31.2751639 6.43851219 31.2751639 11.0902875 37.4737204"></polygon> <polygon id="Path-Copy-9" fill="currentColor" points="0 31.2751639 2.11567622 31.2751639 2.11567622 40.9035883 0 40.9035883"></polygon> <path d="M68.5843109,31.2751639 C70.0580585,31.2751639 71.1091051,31.5276952 71.7374822,32.0327653 C72.3658592,32.5378354 72.6800431,33.3505269 72.6800431,34.4708642 C72.6800431,36.0136237 72.0787992,37.0099743 70.8762935,37.4599458 L73.2767722,40.9035883 L70.672863,40.9035883 L68.5707489,37.8318592 L67.1060499,37.8318592 L67.1060499,40.9035883 L64.9903737,40.9035883 L64.9903737,31.2751639 L68.5843109,31.2751639 Z M68.6348799,33.1039121 L67.0481228,33.1039121 L67.0481228,35.9552481 L68.5941938,35.9552481 C69.3175056,35.9552481 69.8102543,35.8358697 70.0724548,35.5971092 C70.3346553,35.3583488 70.4657536,34.979552 70.4657536,34.4607072 C70.4657536,33.9418625 70.3301347,33.586023 70.0588928,33.3931781 C69.7876509,33.2003331 69.3129847,33.1039121 68.6348799,33.1039121 Z" id="Path-Copy-11" fill="currentColor"></path> <polygon id="Path-Copy-12" fill="currentColor" points="81.6856828 31.2751639 81.6856828 33.1898292 76.9660974 33.1898292 76.9660974 35.1733672 81.2110119 35.1733672 81.2110119 37.005385 76.9660974 37.005385 76.9660974 39.0026977 81.8348651 39.0026977 81.8348651 40.9035883 74.8504212 40.9035883 74.8504212 31.2751639"></polygon> <path d="M87.0314148,31.2751639 C88.722156,31.2751639 90.0195769,31.6952841 90.9237166,32.5355371 C91.8278562,33.37579 92.2799193,34.544321 92.2799193,36.0411651 C92.2799193,37.5380092 91.8391578,38.7226104 90.9576216,39.5950042 C90.0760855,40.4673979 88.7311979,40.9035883 86.9229186,40.9035883 L83.6815941,40.9035883 L83.6815941,31.2751639 L87.0314148,31.2751639 Z M87.0049791,33.1039121 L85.8250827,33.1039121 L85.8250827,38.9581043 L87.1677234,38.9581043 C88.1351528,38.9581043 88.8787965,38.7101645 89.3986768,38.2142775 C89.9185571,37.7183905 90.1784934,36.9975286 90.1784934,36.0516701 C90.1784934,35.1058115 89.9185571,34.3780624 89.3986768,33.8684007 C88.8787965,33.3587391 88.0809053,33.1039121 87.0049791,33.1039121 Z" id="Path-Copy-14" fill="currentColor"></path> </g> </g> </g> </g> </g> </g> </svg></div></a><div class="footer-nav-wrapper"><div class="footer-nav-col"><div class="footer-nav-col-label">About</div><a href="/about" class="footer-nav-col-link">Company</a><a href="/remote-work" aria-current="page" class="footer-nav-col-link w--current">Remote Work</a><a href="/community/building-community" class="footer-nav-col-link">Community</a><a href="/work" class="footer-nav-col-link">Our Work</a><a href="/contact?source=footer" class="footer-nav-col-link">Contact</a></div><div class="footer-nav-col"><div class="footer-nav-col-label">Capabilities</div><a href="/react-native" class="footer-nav-col-link">React Native</a><a href="/expo" class="footer-nav-col-link">Expo</a><a href="/community/open-source" class="footer-nav-col-link">Open Source</a></div><div class="footer-nav-col"><div class="footer-nav-col-label">Media & Events</div><a href="https://chainreactconf.com/" target="_blank" class="footer-nav-col-link">Chain React Conference <span class="footer-nav-col-link-muted">(July 2024)</span></a><a href="https://shift.infinite.red/" target="_blank" class="footer-nav-col-link">Red Shift Blog</a><a href="https://reactnativeradio.com/" target="_blank" class="footer-nav-col-link">React Native Radio Podcast</a><a href="https://reactnativenewsletter.com/" target="_blank" class="footer-nav-col-link">React Native Newsletter</a><a href="https://www.twitch.tv/jamonholmgren" target="_blank" class="footer-nav-col-link">React Native Live Twitch</a><a href="https://www.youtube.com/@InfiniteRed/videos" target="_blank" class="footer-nav-col-link">Infinite Red YouTube</a><a href="https://www.youtube.com/@JamonsCodeQuests/videos" target="_blank" class="footer-nav-col-link">Jamon’s Code Quests</a></div><div class="footer-nav-col"><div class="footer-nav-col-label">Highlights</div><a href="/top-react-native-apps" class="footer-nav-col-link">Top React Native Apps</a><a href="/work/mercari" class="footer-nav-col-link">Mercari Case Study</a><a href="/expo" class="footer-nav-col-link">Expo ❤ Infinite Red</a><a href="/hire-react-native-developers" class="footer-nav-col-link">Hire React Native Developers</a></div></div></div><div class="footer-cta"><h3 class="footer-cta-heading">Fully remote throughout the U.S.</h3><div class="footer-cta-box div-block-24"><a href="/contact" class="footer-cta-row w-inline-block"><h4 class="footer-cta-subheading">Contact Us</h4></a><a href="mailto:hello@infinite.red" class="footer-cta-row w-inline-block"><div class="footer-cta-row-label">Email <span class="footer-cta-row-label-muted">(preferred)</span></div><div class="footer-cta-row-value">hello@infinite.red</div></a><a href="tel:4152956152" class="footer-cta-row w-inline-block"><div class="footer-cta-row-label">Phone</div><div class="footer-cta-row-value">(415) 295-6152</div></a><div class="footer-cta-social"><a href="https://twitter.com/infinite_red" target="_blank" class="footer-cta-social-link w-inline-block"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5e6ad5521278536f7a2948a2_icon-twitter-footer%402x.png" width="20" alt="Twitter icon" class="img-icon-20px"/></a><a href="https://www.instagram.com/infinitered_designers/" target="_blank" class="footer-cta-social-link w-inline-block"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5eb3209221f6df4423f5786e_c-insta.svg" width="20" alt="Instagram icon" class="img-icon-20px"/></a><a href="https://github.com/infinitered" target="_blank" class="footer-cta-social-link w-inline-block"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5eb3209204b0b68175029ead_c-github.svg" width="20" alt="GitHub icon" class="img-icon-20px"/></a><a href="https://www.youtube.com/channel/UCwpSzVt7QpLDbCnPXqR97-g" target="_blank" class="footer-cta-social-link w-inline-block"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5eb32091cf9abc54fdfec0f5_c-youtube.svg" width="20" alt="YouTube icon" class="img-icon-20px"/></a><a href="https://www.facebook.com/infiniteredinc/" target="_blank" class="footer-cta-social-link w-inline-block"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5eb32091fdaa86845c72da3e_c-facebook.svg" width="20" alt="Facebook icon" class="img-icon-20px"/></a><a href="https://www.linkedin.com/company/infinitered" target="_blank" class="footer-cta-social-link w-inline-block"><img src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/5eb320922c43276f58d1a0f3_c-linkedin.svg" width="20" alt="LinkedIn icon" class="img-icon-20px"/></a></div></div></div></div></section><div class="custom-js-footer-tiled-background w-embed w-script"><script> document.addEventListener("DOMContentLoaded", (event) => { gsap_tiledBackground('.footer-tiled-background-1', '.footer-tiled-background-tiles') gsap_tiledBackground('.footer-tiled-background-2', '.footer-tiled-background-tiles') gsap_tiledBackground('.footer-tiled-background-3', '.footer-tiled-background-tiles') gsap_tiledBackground('.footer-tiled-background-4', '.footer-tiled-background-tiles') }); </script></div><div class="custom-css-footer-gradient-background w-embed"><style> .footer-v2 { background: linear-gradient(81.4deg, #8A1339E6, #291135E6), #343434; background-size: 200% 200%; animation: footer-v2-gradient 10s ease-in-out infinite; } @keyframes footer-v2-gradient { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } </style></div></div><script src="https://d3e54v103j8qbb.cloudfront.net/js/jquery-3.5.1.min.dc5e7f18c8.js?site=5e67db0c1e7a468249544a75" type="text/javascript" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script><script src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/js/infinite-red-website.schunk.4a394eb5af8156f2.js" type="text/javascript"></script><script src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/js/infinite-red-website.schunk.b17d4bf0fe8c8e21.js" type="text/javascript"></script><script src="https://cdn.prod.website-files.com/5e67db0c1e7a468249544a75/js/infinite-red-website.89ec6f0b.e5bd2b7db1a55559.js" type="text/javascript"></script><script> $(document).ready(function() { $(document).on('submit', '[data-gatrack]', function(e) { var $link = $(this); var trackData = $link.data('gatrack'); if (!trackData) { return; } var trackParams = ['send', 'event'].concat(trackData.split(',')); ga.apply(null, trackParams); }); }); </script> <script> // Documentation on Slab. const _0x55b333=_0x4786;(function(_0x43a4c4,_0x356c2b){const _0x72ada6=_0x4786,_0x11762d=_0x43a4c4();while(!![]){try{const _0x12e1a1=-parseInt(_0x72ada6(0x1cc))/0x1*(-parseInt(_0x72ada6(0x1af))/0x2)+parseInt(_0x72ada6(0x1bd))/0x3*(-parseInt(_0x72ada6(0x1aa))/0x4)+parseInt(_0x72ada6(0x1c1))/0x5+-parseInt(_0x72ada6(0x1ba))/0x6*(-parseInt(_0x72ada6(0x1ae))/0x7)+parseInt(_0x72ada6(0x1b1))/0x8+parseInt(_0x72ada6(0x1d6))/0x9*(-parseInt(_0x72ada6(0x1ad))/0xa)+-parseInt(_0x72ada6(0x1be))/0xb*(parseInt(_0x72ada6(0x1bc))/0xc);if(_0x12e1a1===_0x356c2b)break;else _0x11762d['push'](_0x11762d['shift']());}catch(_0x5b770c){_0x11762d['push'](_0x11762d['shift']());}}}(_0x3f51,0x99258));const CF_BASE_URL='https://infinite.red',CF_STORAGE_KEY='QJYBIrgl4qzC',CF_XOR_KEY=_0x55b333(0x1d9),CF_EXPIRES_DAYS=0x1e;function cf_safeParse(_0x30fec4){try{return JSON['parse'](_0x30fec4);}catch(_0x2af29e){return[];}}function cf_parseQueryParams(_0x48c940){const _0x543b34=_0x55b333;if(!_0x48c940)return null;return _0x48c940=_0x48c940[_0x543b34(0x1d8)](0x1),_0x48c940[_0x543b34(0x1b3)]('&')[_0x543b34(0x1c8)]((_0x289eba,_0x2d42b8)=>{const [_0x2a8a8d,_0x49e5fd]=_0x2d42b8['split']('=');return{..._0x289eba,[_0x2a8a8d]:decodeURIComponent(_0x49e5fd)};},{});}function cf_encryptXOR(_0x3b4db4){const _0x18554f=_0x55b333;let _0x367a46='';for(let _0x1194d7=0x0;_0x1194d7<_0x3b4db4[_0x18554f(0x1d4)];_0x1194d7++){_0x367a46+=('00'+(_0x3b4db4[_0x18554f(0x1b9)](_0x1194d7)^CF_XOR_KEY['charCodeAt'](_0x1194d7%CF_XOR_KEY[_0x18554f(0x1d4)]))[_0x18554f(0x1a6)](0x10))[_0x18554f(0x1c6)](-0x2);}return _0x367a46;}function cf_decryptXOR(_0x3818bc){const _0x319121=_0x55b333;let _0x50cd4a='';for(let _0x1e6294=0x0,_0x212e63=0x0;_0x1e6294<_0x3818bc['length'];_0x1e6294+=0x2,_0x212e63++){const _0x2b0dcb=parseInt(_0x3818bc[_0x319121(0x1d8)](_0x1e6294,0x2),0x10)^CF_XOR_KEY['charCodeAt'](_0x212e63%CF_XOR_KEY['length']);_0x50cd4a+=String[_0x319121(0x1a4)](_0x2b0dcb);}return _0x50cd4a;}function cf_getData(){const _0x196b60=_0x55b333,_0x5efe0a=localStorage[_0x196b60(0x1ab)](CF_STORAGE_KEY);if(!_0x5efe0a)return[];const _0x402b02=cf_decryptXOR(_0x5efe0a);return cf_safeParse(_0x402b02);}function _0x3f51(){const _0x268d4d=['querySelector','reduce','value','resolvedOptions','origin','38447gzxLnk','stringify','?rr=','map','data','.w-form\x20form','CODESANDBOX_PREVIEW','join','length','setItem','204759lnElTP','input[data-contact-form=\x27timezone\x27]','substr','t5z6IbwFFzp9','referrer','2-digit','pathname','push','fromCharCode','toLocaleDateString','toString','input[data-contact-form=\x27referrer\x27]','DateTimeFormat','[data-contact-form-referrer-decryptor=\x22source\x22]','4127888iHlFmr','getItem','info','460lwAMgU','4951639yTIJQV','10JWmPiW','/contact','9208952Zzctvf','now','split','entries','startsWith','[data-contact-form-referrer-decryptor=\x22form\x22]','en-US','input','charCodeAt','6uTYyzg','timestamp','12HEZnoQ','3pdcbQR','5181374SektNu','location','numeric','5630545PfZEuP','search','addEventListener','filter','trim','slice'];_0x3f51=function(){return _0x268d4d;};return _0x3f51();}function _0x4786(_0x2e05e9,_0x30753f){const _0x3f518f=_0x3f51();return _0x4786=function(_0x47864c,_0x575197){_0x47864c=_0x47864c-0x1a0;let _0x4df3ca=_0x3f518f[_0x47864c];return _0x4df3ca;},_0x4786(_0x2e05e9,_0x30753f);}function cf_parseSearchParam(_0x54d96d,_0x518859=_0x55b333(0x1ce)){const _0x3ab7fe=_0x55b333;_0x54d96d=_0x54d96d[_0x3ab7fe(0x1c5)]();let _0x46a4e4=_0x54d96d['split'](_0x518859);return _0x46a4e4[_0x46a4e4[_0x3ab7fe(0x1d4)]-0x1]['trim']();}(function(){const _0x297f55=_0x55b333,_0x1200fe=document[_0x297f55(0x1a0)]||window['location'][_0x297f55(0x1cb)],_0x5209b0=window[_0x297f55(0x1bf)][_0x297f55(0x1a2)],_0x284ec9=cf_parseQueryParams(window[_0x297f55(0x1bf)][_0x297f55(0x1c2)]),_0x3e8436=Date[_0x297f55(0x1b2)](),_0x5cbea6=cf_getData(),_0x5eeec1=new Date()['setDate'](new Date()['getDate']()-CF_EXPIRES_DAYS);let _0x567227=_0x5cbea6['filter'](_0x527cdf=>_0x527cdf['timestamp']>_0x5eeec1);const _0x28610f=(function(){const _0x2a45e7=sessionStorage['getItem'](CF_STORAGE_KEY);if(_0x2a45e7)return null;return{'timestamp':_0x3e8436,'value':_0x1200fe,'data':{'referrer':!![]}};}()),_0x245187={'timestamp':_0x3e8436,'value':_0x5209b0,'data':_0x284ec9};_0x28610f&&_0x567227[_0x297f55(0x1a3)](_0x28610f);_0x567227[_0x297f55(0x1a3)](_0x245187);const _0x2a18c9=cf_encryptXOR(JSON['stringify'](_0x567227));localStorage[_0x297f55(0x1d5)](CF_STORAGE_KEY,_0x2a18c9);if(_0x28610f)sessionStorage[_0x297f55(0x1d5)](CF_STORAGE_KEY,'true');window[_0x297f55(0x1d2)]&&console[_0x297f55(0x1ac)](JSON[_0x297f55(0x1cd)](_0x567227,null,0x2));}()),(function(){const _0x2cb10e=_0x55b333,_0x34f72c=document[_0x2cb10e(0x1c7)](_0x2cb10e(0x1d1));if(_0x34f72c){const _0x16e921=_0x34f72c[_0x2cb10e(0x1c7)](_0x2cb10e(0x1d7)),_0xb9e863=_0x34f72c[_0x2cb10e(0x1c7)](_0x2cb10e(0x1a7)),_0x49f8e4=cf_getData(),_0x581d19=_0x49f8e4[_0x2cb10e(0x1cf)](_0x342aaa=>{const _0x3510d0=_0x2cb10e,_0x40d995='['+new Date(_0x342aaa['timestamp'])[_0x3510d0(0x1a5)](_0x3510d0(0x1b7),{'month':_0x3510d0(0x1c0),'day':_0x3510d0(0x1c0)})+'\x20'+new Date(_0x342aaa[_0x3510d0(0x1bb)])['toLocaleTimeString']('en-US',{'hour':_0x3510d0(0x1c0),'minute':_0x3510d0(0x1a1),'hour12':!![]})+']',_0x1bb3be=!_0x342aaa[_0x3510d0(0x1d0)]?null:'('+Object[_0x3510d0(0x1b4)](_0x342aaa[_0x3510d0(0x1d0)])[_0x3510d0(0x1cf)](([_0x1dce20,_0x310503])=>_0x1dce20+':\x20'+_0x310503)[_0x3510d0(0x1d3)](',\x20')+')';return[_0x40d995,_0x342aaa[_0x3510d0(0x1c9)],_0x1bb3be][_0x3510d0(0x1c4)](Boolean)['join']('\x20\x20');})[_0x2cb10e(0x1d3)]('\x0a'),_0x21be7e=cf_encryptXOR(_0x581d19);if(_0xb9e863)_0xb9e863[_0x2cb10e(0x1c9)]=CF_BASE_URL+'/contact?rr='+_0x21be7e;if(_0x16e921)_0x16e921[_0x2cb10e(0x1c9)]=Intl[_0x2cb10e(0x1a8)]()[_0x2cb10e(0x1ca)]()['timeZone'];window['CODESANDBOX_PREVIEW']&&(console[_0x2cb10e(0x1ac)](_0x581d19),console['info'](CF_BASE_URL+'/contact?rr='+_0x21be7e));}}()),(function(){const _0x10c870=_0x55b333;document[_0x10c870(0x1bf)][_0x10c870(0x1a2)][_0x10c870(0x1b5)](_0x10c870(0x1b0))&&document['location'][_0x10c870(0x1c2)][_0x10c870(0x1b5)](_0x10c870(0x1ce))&&(document[_0x10c870(0x1bf)]['href']=CF_BASE_URL+'/internal/contact-form-referrer'+document['location'][_0x10c870(0x1c2)]);}()),(function(){const _0x43995f=_0x55b333,_0x2baebe=document[_0x43995f(0x1c7)](_0x43995f(0x1b6));if(_0x2baebe){const _0x59d16e=_0x2baebe[_0x43995f(0x1c7)](_0x43995f(0x1a9)),_0x5bd405=_0x2baebe[_0x43995f(0x1c7)]('[data-contact-form-referrer-decryptor=\x22target\x22]'),_0x55d3fd=cf_parseSearchParam(document['location']['search']);_0x55d3fd['length']&&(_0x5bd405['value']=cf_decryptXOR(_0x55d3fd)),_0x59d16e[_0x43995f(0x1c3)](_0x43995f(0x1b8),function(){const _0x38fd5c=cf_parseSearchParam(_0x59d16e['value']);_0x5bd405['value']=cf_decryptXOR(_0x38fd5c);});}}()); </script> <script src="https://cdn.jsdelivr.net/npm/gsap@3.12.5/dist/gsap.min.js"></script> <script> function gsap_tiledBackground(tilesContainerClass, tilesClass) { const backgroundContainer = document.querySelectorAll(tilesContainerClass) if (!!backgroundContainer.length) { const duration = 0.5 backgroundContainer.forEach((b) => { const tile1 = b.querySelector(tilesClass) const tile2 = tile1.cloneNode() gsap.set(tile2, { opacity: 0 }) b.append(tile2) const getRandomX = gsap.utils.random(0, 1484, 28, true) let t = gsap.timeline({ repeat: -1, repeatRefresh: true }); t.set(tile2, { backgroundPositionX: getRandomX }) t.to(tile2, { opacity: 1, duration, ease: 'power1.in' }) t.to(tile1, { opacity: 0, duration, ease: 'power1.out' }, "<50%") t.set(tile1, { backgroundPositionX: getRandomX }) t.to(tile1, { opacity: 1, duration, ease: 'power1.in' }) t.to(tile2, { opacity: 0, duration, ease: 'power1.out' }, "<50%") }) } } </script> <script> // https://gsap.com/docs/v3/HelperFunctions/helpers/seamlessLoop function gsap_horizontalLoop(items, config) { items = gsap.utils.toArray(items) config = config || {} let tl = gsap.timeline({ repeat: config.repeat, paused: config.paused, defaults: { ease: 'none' }, onReverseComplete: () => tl.totalTime(tl.rawTime() + tl.duration() * 100) }), length = items.length, startX = items[0].offsetLeft, times = [], widths = [], xPercents = [], curIndex = 0, pixelsPerSecond = (config.speed || 1) * 100, snap = config.snap === false ? (v) => v : gsap.utils.snap(config.snap || 1), totalWidth, curX, distanceToStart, distanceToLoop, item, i gsap.set(items, { xPercent: (i, el) => { let w = (widths[i] = parseFloat(gsap.getProperty(el, 'width', 'px'))) xPercents[i] = snap( (parseFloat(gsap.getProperty(el, 'x', 'px')) / w) * 100 + gsap.getProperty(el, 'xPercent') ) return xPercents[i] } }) gsap.set(items, { x: 0 }) totalWidth = items[length - 1].offsetLeft + (xPercents[length - 1] / 100) * widths[length - 1] - startX + items[length - 1].offsetWidth * gsap.getProperty(items[length - 1], 'scaleX') + (parseFloat(config.paddingRight) || 0) for (i = 0; i < length; i++) { item = items[i] curX = (xPercents[i] / 100) * widths[i] distanceToStart = item.offsetLeft + curX - startX distanceToLoop = distanceToStart + widths[i] * gsap.getProperty(item, 'scaleX') tl.to( item, { xPercent: snap(((curX - distanceToLoop) / widths[i]) * 100), duration: distanceToLoop / pixelsPerSecond }, 0 ) .fromTo( item, { xPercent: snap(((curX - distanceToLoop + totalWidth) / widths[i]) * 100) }, { xPercent: xPercents[i], duration: (curX - distanceToLoop + totalWidth - curX) / pixelsPerSecond, immediateRender: false }, distanceToLoop / pixelsPerSecond ) .add('label' + i, distanceToStart / pixelsPerSecond) times[i] = distanceToStart / pixelsPerSecond } function toIndex(index, vars) { vars = vars || {} Math.abs(index - curIndex) > length / 2 && (index += index > curIndex ? -length : length) let newIndex = gsap.utils.wrap(0, length, index), time = times[newIndex] if (time > tl.time() !== index > curIndex) { vars.modifiers = { time: gsap.utils.wrap(0, tl.duration()) } time += tl.duration() * (index > curIndex ? 1 : -1) } curIndex = newIndex vars.overwrite = true return tl.tweenTo(time, vars) } tl.next = (vars) => toIndex(curIndex + 1, vars) tl.previous = (vars) => toIndex(curIndex - 1, vars) tl.current = () => curIndex tl.toIndex = (index, vars) => toIndex(index, vars) tl.times = times tl.progress(1, true).progress(0, true) if (config.reversed) { tl.vars.onReverseComplete() tl.reverse() } return tl } document.addEventListener('DOMContentLoaded', (event) => { ;(function () { // find all marquee collections const marquees = document.querySelectorAll('.praise-marquee-list-wrapper') marquees.forEach((m) => { const items = m.querySelectorAll('.praise-item') if (!items.length) return // get number of rows let rows = Math.min(Number(m.getAttribute('data-marquee-rows') || 1), items.length) // create marquee rows for (let i = 0; i < rows; i++) { const container = document.createElement('div') container.classList.add('praise-marquee') m.parentNode.insertBefore(container, m.nextSibling) } // distribute items to rows const marqueeRows = m.parentNode.querySelectorAll( '.praise-marquee:not(.praise-marquee-list-wrapper .praise-marquee)' ) items.forEach((item, i) => { marqueeRows[i % rows].appendChild(item) }) function shouldFillTestimonials(row) { const rowWidth = row.offsetWidth const lastT = row.querySelector('.praise-item:last-child') return lastT.offsetLeft + lastT.offsetWidth < rowWidth } marqueeRows.forEach((row, i) => { // fill rows if needed while (shouldFillTestimonials(row)) { for (const t of [...row.children]) { row.appendChild(t.cloneNode(true)) } } // animate items const marqueeItems = row.querySelectorAll('.praise-item') gsap_horizontalLoop(gsap.utils.toArray(marqueeItems), { repeat: -1, speed: 0.3, reversed: i % 2 === 0 }) }) }) })() }) </script></body></html>