Google Gemini Winners | Gemini API Developer Competition

<!doctype html> <html lang="en" dir="ltr"> <head> <meta name="google-signin-client-id" content="157101835696-ooapojlodmuabs2do2vuhhnf90bccmoi.apps.googleusercontent.com"> <meta name="google-signin-scope" content="profile email https://www.googleapis.com/auth/developerprofiles https://www.googleapis.com/auth/developerprofiles.award"> <meta property="og:site_name" content="Google AI for Developers"> <meta property="og:type" content="website"><meta name="theme-color" content="#1967d2"><meta charset="utf-8"> <meta content="IE=Edge" http-equiv="X-UA-Compatible"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="manifest" href="/_pwa/googledevai/manifest.json" crossorigin="use-credentials"> <link rel="preconnect" href="//www.gstatic.com" crossorigin> <link rel="preconnect" href="//fonts.gstatic.com" crossorigin> <link rel="preconnect" href="//fonts.googleapis.com" crossorigin> <link rel="preconnect" href="//apis.google.com" crossorigin> <link rel="preconnect" href="//www.google-analytics.com" crossorigin><link rel="stylesheet" href="//fonts.googleapis.com/css?family=Google+Sans:400,500|Roboto:400,400italic,500,500italic,700,700italic|Roboto+Mono:400,500,700&display=swap"> <link rel="stylesheet" href="//fonts.googleapis.com/css2?family=Material+Icons&family=Material+Symbols+Outlined&display=block"><link rel="stylesheet" href="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/googledevai/css/app.css"> <link rel="shortcut icon" href="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/googledevai/images/favicon-new.png"> <link rel="apple-touch-icon" href="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/googledevai/images/touchicon-180-new.png"><link rel="canonical" href="https://ai.google.dev/competition"><link rel="search" type="application/opensearchdescription+xml" title="Google AI for Developers" href="https://ai.google.dev/s/opensearch.xml"> <link rel="alternate" hreflang="en" href="https://ai.google.dev/competition" /><link rel="alternate" hreflang="x-default" href="https://ai.google.dev/competition" /><link rel="alternate" hreflang="ar" href="https://ai.google.dev/competition?hl=ar" /><link rel="alternate" hreflang="bn" href="https://ai.google.dev/competition?hl=bn" /><link rel="alternate" hreflang="zh-Hans" href="https://ai.google.dev/competition?hl=zh-cn" /><link rel="alternate" hreflang="zh-Hant" href="https://ai.google.dev/competition?hl=zh-tw" /><link rel="alternate" hreflang="fa" href="https://ai.google.dev/competition?hl=fa" /><link rel="alternate" hreflang="fr" href="https://ai.google.dev/competition?hl=fr" /><link rel="alternate" hreflang="de" href="https://ai.google.dev/competition?hl=de" /><link rel="alternate" hreflang="he" href="https://ai.google.dev/competition?hl=he" /><link rel="alternate" hreflang="hi" href="https://ai.google.dev/competition?hl=hi" /><link rel="alternate" hreflang="id" href="https://ai.google.dev/competition?hl=id" /><link rel="alternate" hreflang="it" href="https://ai.google.dev/competition?hl=it" /><link rel="alternate" hreflang="ja" href="https://ai.google.dev/competition?hl=ja" /><link rel="alternate" hreflang="ko" href="https://ai.google.dev/competition?hl=ko" /><link rel="alternate" hreflang="pl" href="https://ai.google.dev/competition?hl=pl" /><link rel="alternate" hreflang="pt-BR" href="https://ai.google.dev/competition?hl=pt-br" /><link rel="alternate" hreflang="ru" href="https://ai.google.dev/competition?hl=ru" /><link rel="alternate" hreflang="es-419" href="https://ai.google.dev/competition?hl=es-419" /><link rel="alternate" hreflang="th" href="https://ai.google.dev/competition?hl=th" /><link rel="alternate" hreflang="tr" href="https://ai.google.dev/competition?hl=tr" /><link rel="alternate" hreflang="vi" href="https://ai.google.dev/competition?hl=vi" /><title>Google Gemini Winners  |  Gemini API Developer Competition  |  Google AI for Developers</title> <meta property="og:title" content="Google Gemini Winners  |  Gemini API Developer Competition  |  Google AI for Developers"><meta name="description" content="Google Gemini Winners"> <meta property="og:description" content="Google Gemini Winners"><meta property="og:url" content="https://ai.google.dev/competition"><meta property="og:image" content="https://ai.google.dev/static/site-assets/images/share.png"> <meta property="og:image:width" content="1200"> <meta property="og:image:height" content="675"><meta property="og:locale" content="en"><meta name="twitter:card" content="summary_large_image"> <meta content="IE=Edge" http-equiv="X-UA-Compatible"> <meta content="width=device-width, initial-scale=1.0, shrink-to-fit=no, height=device-height" name="viewport"> <meta name="keywords" content="Google Gemini Competition, MediaPipe, TensorFlow Lite"> <link rel="stylesheet" href="/extras.css"></head> <body class="" template="page" theme="googledevai-theme" type="marketing" layout="full" pending> <devsite-progress type="indeterminate" id="app-progress"></devsite-progress> <section class="devsite-wrapper"> <devsite-cookie-notification-bar></devsite-cookie-notification-bar><devsite-header role="banner" keep-tabs-visible> <div class="devsite-header--inner nocontent"> <div class="devsite-top-logo-row-wrapper-wrapper"> <div class="devsite-top-logo-row-wrapper"> <div class="devsite-top-logo-row"> <button type="button" id="devsite-hamburger-menu" class="devsite-header-icon-button button-flat material-icons gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Navigation menu button" visually-hidden aria-label="Open menu"> </button> <div class="devsite-product-name-wrapper"> <a href="/" class="devsite-site-logo-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Site logo" track-type="globalNav" track-name="geminiAPIDeveloperCompetition" track-metadata-position="nav" track-metadata-eventDetail="nav"> <picture> <img src="https://ai.google.dev/_static/googledevai/images/lockup-new.svg" class="devsite-site-logo" alt="Gemini API Developer Competition"> </picture> </a> <span class="devsite-product-name"> <ul class="devsite-breadcrumb-list" > <li class="devsite-breadcrumb-item "> </li> </ul> </span> </div> <div class="devsite-top-logo-row-middle"> <div class="devsite-header-upper-tabs"> <devsite-tabs class="upper-tabs"> <nav class="devsite-tabs-wrapper" aria-label="Upper tabs"> <tab > <a href="https://ai.google.dev/gemini-api/docs" track-metadata-eventdetail="https://ai.google.dev/gemini-api/docs" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - gemini api" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Gemini API" track-name="gemini api" > Gemini API </a> </tab> <tab > <a href="https://aistudio.google.com" track-metadata-eventdetail="https://aistudio.google.com" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - google ai studio" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Google AI Studio" track-name="google ai studio" > Google AI Studio </a> </tab> <tab > <a href="https://ai.google.dev/gemma" track-metadata-eventdetail="https://ai.google.dev/gemma" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - gemma" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Gemma" track-name="gemma" > Gemma </a> </tab> <tab > <a href="https://ai.google.dev/edge" track-metadata-eventdetail="https://ai.google.dev/edge" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - google ai edge" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Google AI Edge" track-name="google ai edge" > Google AI Edge </a> </tab> <tab class="devsite-dropdown "> <span class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - tools" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Tools" track-name="tools" > Tools </span> <a href="#" role="button" aria-haspopup="true" aria-expanded="false" aria-label="Dropdown menu for Tools" track-type="nav" track-metadata-eventdetail="" track-metadata-position="nav - tools" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Tools" track-name="tools" class="devsite-tabs-dropdown-toggle devsite-icon devsite-icon-arrow-drop-down"></a> <div class="devsite-tabs-dropdown" aria-label="submenu" hidden> <div class="devsite-tabs-dropdown-content"> <div class="devsite-tabs-dropdown-column "> <ul class="devsite-tabs-dropdown-section "> <li class="devsite-nav-item"> <a href="https://ai.google.dev/responsible" track-type="nav" track-metadata-eventdetail="https://ai.google.dev/responsible" track-metadata-position="nav - tools" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Responsible GenAI Toolkit </div> </a> </li> <li class="devsite-nav-item"> <a href="https://colab.google/" track-type="nav" track-metadata-eventdetail="https://colab.google/" track-metadata-position="nav - tools" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Colab </div> </a> </li> <li class="devsite-nav-item"> <a href="https://firebase.google.com/docs/genkit" track-type="nav" track-metadata-eventdetail="https://firebase.google.com/docs/genkit" track-metadata-position="nav - tools" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Firebase Genkit </div> </a> </li> <li class="devsite-nav-item"> <a href="https://jax.readthedocs.io/" track-type="nav" track-metadata-eventdetail="https://jax.readthedocs.io/" track-metadata-position="nav - tools" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> JAX </div> </a> </li> <li class="devsite-nav-item"> <a href="https://keras.io/" track-type="nav" track-metadata-eventdetail="https://keras.io/" track-metadata-position="nav - tools" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Keras </div> </a> </li> <li class="devsite-nav-item"> <a href="https://www.tensorflow.org/" track-type="nav" track-metadata-eventdetail="https://www.tensorflow.org/" track-metadata-position="nav - tools" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> TensorFlow </div> </a> </li> </ul> </div> </div> </div> </tab> <tab > <a href="https://discuss.ai.google.dev/" track-metadata-eventdetail="https://discuss.ai.google.dev/" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - community" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Community" track-name="community" > Community </a> </tab> </nav> </devsite-tabs> </div> <devsite-search enable-signin enable-search enable-suggestions enable-query-completion project-name="Gemini API Developer Competition" tenant-name="Google AI for Developers" > <form class="devsite-search-form" action="https://ai.google.dev/s/results" method="GET"> <div class="devsite-search-container"> <button type="button" search-open class="devsite-search-button devsite-header-icon-button button-flat material-icons" aria-label="Open search"></button> <div class="devsite-searchbox"> <input aria-activedescendant="" aria-autocomplete="list" aria-label="Search" aria-expanded="false" aria-haspopup="listbox" autocomplete="off" class="devsite-search-field devsite-search-query" name="q" placeholder="Search" role="combobox" type="text" value="" > <div class="devsite-search-image material-icons" aria-hidden="true"> </div> <div class="devsite-search-shortcut-icon-container" aria-hidden="true"> <kbd class="devsite-search-shortcut-icon">/</kbd> </div> </div> </div> </form> <button type="button" search-close class="devsite-search-button devsite-header-icon-button button-flat material-icons" aria-label="Close search"></button> </devsite-search> </div> <devsite-language-selector> <ul role="presentation"> <li role="presentation"> <a role="menuitem" lang="en" >English</a> </li> <li role="presentation"> <a role="menuitem" lang="de" >Deutsch</a> </li> <li role="presentation"> <a role="menuitem" lang="es_419" >Español – América Latina</a> </li> <li role="presentation"> <a role="menuitem" lang="fr" >Français</a> </li> <li role="presentation"> <a role="menuitem" lang="id" >Indonesia</a> </li> <li role="presentation"> <a role="menuitem" lang="it" >Italiano</a> </li> <li role="presentation"> <a role="menuitem" lang="pl" >Polski</a> </li> <li role="presentation"> <a role="menuitem" lang="pt_br" >Português – Brasil</a> </li> <li role="presentation"> <a role="menuitem" lang="vi" >Tiếng Việt</a> </li> <li role="presentation"> <a role="menuitem" lang="tr" >Türkçe</a> </li> <li role="presentation"> <a role="menuitem" lang="ru" >Русский</a> </li> <li role="presentation"> <a role="menuitem" lang="he" >עברית</a> </li> <li role="presentation"> <a role="menuitem" lang="ar" >العربيّة</a> </li> <li role="presentation"> <a role="menuitem" lang="fa" >فارسی</a> </li> <li role="presentation"> <a role="menuitem" lang="hi" >हिंदी</a> </li> <li role="presentation"> <a role="menuitem" lang="bn" >বাংলা</a> </li> <li role="presentation"> <a role="menuitem" lang="th" >ภาษาไทย</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_cn" >中文 – 简体</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_tw" >中文 – 繁體</a> </li> <li role="presentation"> <a role="menuitem" lang="ja" >日本語</a> </li> <li role="presentation"> <a role="menuitem" lang="ko" >한국어</a> </li> </ul> </devsite-language-selector> <devsite-user enable-profiles id="devsite-user"> <span class="button devsite-top-button" aria-hidden="true" visually-hidden>Sign in</span> </devsite-user> </div> </div> </div> <div class="devsite-collapsible-section devsite-header-no-lower-tabs "> <div class="devsite-header-background"> </div> </div> </div> </devsite-header> <devsite-book-nav scrollbars hidden> <div class="devsite-book-nav-filter" hidden> <span class="filter-list-icon material-icons" aria-hidden="true"></span> <input type="text" placeholder="Filter" aria-label="Type to filter" role="searchbox"> <span class="filter-clear-button hidden" data-title="Clear filter" aria-label="Clear filter" role="button" tabindex="0"></span> </div> <nav class="devsite-book-nav devsite-nav nocontent" aria-label="Side menu"> <div class="devsite-mobile-header"> <button type="button" id="devsite-close-nav" class="devsite-header-icon-button button-flat material-icons gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Close navigation" aria-label="Close navigation"> </button> <div class="devsite-product-name-wrapper"> <a href="/" class="devsite-site-logo-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Site logo" track-type="globalNav" track-name="geminiAPIDeveloperCompetition" track-metadata-position="nav" track-metadata-eventDetail="nav"> <picture> <img src="https://ai.google.dev/_static/googledevai/images/lockup-new.svg" class="devsite-site-logo" alt="Gemini API Developer Competition"> </picture> </a> <span class="devsite-product-name"> <ul class="devsite-breadcrumb-list" > <li class="devsite-breadcrumb-item "> </li> </ul> </span> </div> </div> <div class="devsite-book-nav-wrapper"> <div class="devsite-mobile-nav-top"> <ul class="devsite-nav-list"> <li class="devsite-nav-item"> <a href="/gemini-api/docs" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Gemini API" track-name="gemini api" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Gemini API" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Gemini API </span> </a> </li> <li class="devsite-nav-item"> <a href="https://aistudio.google.com" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Google AI Studio" track-name="google ai studio" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Google AI Studio" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Google AI Studio </span> </a> </li> <li class="devsite-nav-item"> <a href="/gemma" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Gemma" track-name="gemma" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Gemma" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Gemma </span> </a> </li> <li class="devsite-nav-item"> <a href="/edge" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Google AI Edge" track-name="google ai edge" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Google AI Edge" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Google AI Edge </span> </a> </li> <li class="devsite-nav-item"> <span class="devsite-nav-title" tooltip data-category="Site-Wide Custom Events" data-label="Tab: Tools" track-name="tools" > <span class="devsite-nav-text" tooltip > Tools </span> </span> <ul class="devsite-nav-responsive-tabs devsite-nav-has-menu "> <li class="devsite-nav-item"> <span class="devsite-nav-title" tooltip data-category="Site-Wide Custom Events" data-label="Tab: Tools" track-name="tools" > <span class="devsite-nav-text" tooltip menu="Tools"> More </span> <span class="devsite-nav-icon material-icons" data-icon="forward" menu="Tools"> </span> </span> </li> </ul> </li> <li class="devsite-nav-item"> <a href="https://discuss.ai.google.dev/" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Community" track-name="community" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Community" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Community </span> </a> </li> </ul> </div> <div class="devsite-mobile-nav-bottom"> <ul class="devsite-nav-list" menu="Tools" aria-label="Side menu" hidden> <li class="devsite-nav-item"> <a href="/responsible" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Responsible GenAI Toolkit" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Responsible GenAI Toolkit </span> </a> </li> <li class="devsite-nav-item"> <a href="https://colab.google/" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Colab" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Colab </span> </a> </li> <li class="devsite-nav-item"> <a href="https://firebase.google.com/docs/genkit" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Firebase Genkit" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Firebase Genkit </span> </a> </li> <li class="devsite-nav-item"> <a href="https://jax.readthedocs.io/" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: JAX" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > JAX </span> </a> </li> <li class="devsite-nav-item"> <a href="https://keras.io/" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Keras" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Keras </span> </a> </li> <li class="devsite-nav-item"> <a href="https://www.tensorflow.org/" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: TensorFlow" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > TensorFlow </span> </a> </li> </ul> </div> </div> </nav> </devsite-book-nav> <section id="gc-wrapper"> <main role="main" class="devsite-main-content" > <div class="devsite-sidebar"> <div class="devsite-sidebar-content"> <devsite-toc class="devsite-nav" role="navigation" aria-label="On this page" depth="2" scrollbars disabled></devsite-toc> <devsite-recommendations-sidebar class="nocontent devsite-nav"> </devsite-recommendations-sidebar> </div> </div> <devsite-content> <article class="devsite-article"><style> /* Styles inlined from /css/style.css */ [theme=googledevai-theme][layout=full] { --devsite-main-content-padding: 40px 0; } @media screen and (max-width: 600px) { [theme=googledevai-theme][layout=full] { --devsite-main-content-padding: 16px 0; --devsite-banner-margin: -16px 0 16px; } } @media screen and (max-width: 840px) { [theme=googledevai-theme][layout=full] { --devsite-main-content-padding: 24px 0; --devsite-banner-margin: -24px 0 16px; } } .gemini-page { font-family: var(--gemini-font-primary); font-size: var(--gemini-font-size-base); background-color: var(--gemini-color-background); color: var(--gemini-color-foreground); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeSpeed; display: block; } .gemini-page * { margin: 0; } .devsite-article .gemini-page h1:first-of-type { display: flex; margin-top: inherit; vertical-align: inherit; } .gemini-page *, .gemini-page *:before, .gemini-page *:after { box-sizing: border-box; } .gemini-page ol, .gemini-page ul, .gemini-page li { /* all: unset; */ list-style: none; padding: 0; } .gemini-page img, .gemini-page picture, .gemini-page video, .gemini-page canvas, .gemini-page svg { max-inline-size: 100%; block-size: auto; } .gemini-page input, .gemini-page button, .gemini-page textarea, .gemini-page select { font: inherit; } /* remove link drag and call-out menu on touch */ .gemini-page a, .gemini-page img { -webkit-touch-callout: none; -webkit-user-drag: none; } /* Hide outline for mouse users. */ .gemini-page :focus:not(:focus-visible) { outline: none; } .gemini-page { --gemini-color-white: rgb(255 255 255); --gemini-color-grey-50: #f7f9fd; --gemini-color-grey-100: #f0f3f8; --gemini-color-grey-200: #d2d8e4; --gemini-color-grey-300: #b7becf; --gemini-color-grey-400: #939db6; --gemini-color-grey-500: #828fb1; --gemini-color-grey-600: #2f3543; --gemini-color-grey-700: #1b212d; --gemini-color-grey-800: #161823; --gemini-color-grey-900: #060606; --gemini-color-black: rgb(0 0 0); --gemini-color-gemini-peach: #FFDDB7; --gemini-color-gemini-blue: #368EFE; --gemini-color-gemini-cyan: #4FABFF; --gemini-color-gemini-light-blue: #B1C5FF; --gemini-color-gemini-white: var(--gemini-color-white); --gemini-color-gemini-grey-700: #5F6368; --gemini-color-gemini-grey-900: #202124; --gemini-color-blue: #368efe; --gemini-color-purple-100: #ac87eb; --gemini-color-red-200: #ee4d5d; --gemini-color-green-800: #137333; --gemini-color-blue-800: #185ABC; --gemini-color-blue-gradient: linear-gradient(61deg, #64b8fb 6.28%, #217bfe 76.97%); --gemini-color-pink-gradient: linear-gradient(90deg, #a485fa -104.88%, var(--gemini-color-red-200) 198.78%); --gemini-color-logo-gradient: linear-gradient(90deg, #217bfe 0%, #078efb 33.53%, #ac87eb 70%, #ee4d5d 100%); --gemini-color-primary-button-gradient: linear-gradient(52deg, #0844ff 11.5%, #64b8fb 129.52%); --gemini-color-chart-gradient: linear-gradient(105deg, #446eff 18.71%, #2e96ff 49.8%, #b1c5ff 90.55%); --gemini-color-foreground: var(--gemini-color-white); --gemini-color-background: var(--gemini-color-grey-900); --gemini-branding-button-gradient: linear-gradient(15deg, #217BFE 1.02%, #078EFB 28.51%, #A190FF 80.14%, #BD99FE 102.85%); --gemini-branding-text-gradient: linear-gradient(90deg, #217BFE 0%, #078EFB 33.53%, #AC87EB 67.74%, #EE4D5D 100%); --gemini-gradient-linear-colors: var(--gemini-color-gemini-blue) 5.96%, var(--gemini-color-gemini-cyan) 56.89%, var(--gemini-color-gemini-light-blue) 93.53%; --gemini-gradient-linear: linear-gradient(53deg, #0260FF 9.29%, #40A2FF 48.23%, #A8BEFF 82.56%); --gemini-text-gradient-light-blue: linear-gradient(69deg, #AABDF4 16.42%, #FFF 77.56%, #A8BEFF 124.91%); } .gemini-page .gemini-text-color-grey-400 { color: var(--gemini-color-grey-400); } .gemini-page .gemini-text-color-grey-500 { color: var(--gemini-color-grey-500); } .gemini-page { --gemini-font-primary: "Google Sans", Arial, Helvetica, sans-serif; --gemini-font-secondary: "Roboto Mono", Courier, monospace; --gemini-font-tertiary: "Google Sans Text", Arial, Helvetica, sans-serif; --gemini-font-size-base: 16px; --gemini-size-grid-margin: 20px; --gemini-size-max-width: calc(1440px + var(--gemini-size-grid-margin) * 2); --gemini-size-grid-gap: 8px; --devsite-main-content-padding-top: 40px; } @media (min-width: 600px) { .gemini-page { --gemini-size-grid-margin: 40px; --gemini-size-grid-gap: 20px; } } @media (min-width: 1440px) { .gemini-page { --gemini-size-grid-margin: 80px; } } .gemini-page { --gemini-border-radius-d16: 8px; --gemini-border-radius-d24: 16px; --gemini-border-radius-d32: 24px; } @media (min-width: 834px) { .gemini-page { --gemini-border-radius-d16: 16px; --gemini-border-radius-d24: 24px; --gemini-border-radius-d32: 32px; } } .gemini-page { --gemini-ease-in-quad: cubic-bezier(0.55, 0.085, 0.68, 0.53); --gemini-ease-in-cubic: cubic-bezier(0.55, 0.055, 0.675, 0.19); --gemini-ease-in-quart: cubic-bezier(0.895, 0.03, 0.685, 0.22); --gemini-ease-in-quint: cubic-bezier(0.755, 0.05, 0.855, 0.06); --gemini-ease-in-expo: cubic-bezier(0.95, 0.05, 0.795, 0.035); --gemini-ease-in-circ: cubic-bezier(0.6, 0.04, 0.98, 0.335); --gemini-ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94); --gemini-ease-out-cubic: cubic-bezier(0.215, 0.61, 0.355, 1); --gemini-ease-out-quart: cubic-bezier(0.165, 0.84, 0.44, 1); --gemini-ease-out-quint: cubic-bezier(0.23, 1, 0.32, 1); --gemini-ease-out-expo: cubic-bezier(0.19, 1, 0.22, 1); --gemini-ease-out-circ: cubic-bezier(0.075, 0.82, 0.165, 1); --gemini-ease-in-out-quad: cubic-bezier(0.455, 0.03, 0.515, 0.955); --gemini-ease-in-out-cubic: cubic-bezier(0.645, 0.045, 0.355, 1); --gemini-ease-in-out-quart: cubic-bezier(0.77, 0, 0.175, 1); --gemini-ease-in-out-quint: cubic-bezier(0.86, 0, 0.07, 1); --gemini-ease-in-out-expo: cubic-bezier(1, 0, 0, 1); --gemini-ease-in-out-circ: cubic-bezier(0.785, 0.135, 0.15, 0.86); --gemini-ease-out-back: cubic-bezier(0.34, 1.85, 0.64, 1); --gemini-viewport-height: 100vh; --gemini-100vh: var(--gemini-viewport-height, 100vh); } .gemini-center-wrapper { display: flex; justify-content: center; align-items: center; } .gemini-page .gemini-type-d1, .gemini-page .gemini-type-d2, .gemini-page .gemini-type-d3, .gemini-page .gemini-type-d4 { font-family: var(--gemini-font-primary); line-height: 100%; font-weight: 400; } .gemini-page .gemini-type-d1 { font-size: 3.5rem; letter-spacing: -0.025862069em; } .gemini-page .gemini-type-d2 { font-size: 3rem; letter-spacing: -0.021em; } .gemini-page .gemini-type-d3 { font-size: 2.75rem; letter-spacing: -0.05rem; line-height: 105%; } .gemini-page .gemini-type-d4 { font-size: 2.25rem; line-height: 110%; letter-spacing: -0.05rem; } @media (min-width: 834px) { .gemini-page .gemini-type-d4 { font-size: 4rem; letter-spacing: -0.0125em; } } .gemini-page .gemini-type-h1, .gemini-page .gemini-type-h2, .gemini-page .gemini-type-h3, .gemini-page .gemini-type-h4 { font-family: var(--gemini-font-primary); line-height: 120%; font-weight: 400; } .gemini-page .gemini-type-h1 { font-size: 1.625rem; letter-spacing: -0.03125rem; } .gemini-page .gemini-type-h2 { font-size: 1.625rem; letter-spacing: -0.03125rem; } .gemini-page .gemini-type-h3 { font-size: 1.5rem; line-height: 120%; letter-spacing: -0.03125rem; } .gemini-page .gemini-type-h4 { font-size: 1.375rem; } .gemini-page .gemini-type-t1-medium, .gemini-page .gemini-type-t1, .gemini-page .gemini-type-t2, .gemini-page .gemini-type-t3 { font-family: var(--gemini-font-primary); } .gemini-page .gemini-type-t1-medium { font-size: 1rem; font-weight: 500; line-height: 140%; } .gemini-page .gemini-type-t1 { font-size: 1rem; font-weight: 400; line-height: 140%; } .gemini-page .gemini-type-t2 { font-size: 0.875rem; font-weight: 500; line-height: 140%; } .gemini-page .gemini-type-t3 { font-size: 0.75rem; font-weight: 500; line-height: 140%; } .gemini-page .gemini-type-b1, .gemini-page .gemini-type-b2 { font-family: var(--gemini-font-primary); font-weight: 400; line-height: 160%; } .gemini-page .gemini-type-b1 { font-size: 0.875rem; } .gemini-page .gemini-type-b2 { font-size: 0.875rem; line-height: 160%; } .gemini-page .gemini-type-btn { font-family: var(--gemini-font-primary); font-size: 0.875rem; font-weight: 500; line-height: 1.625em; } .gemini-page .gemini-type-btn-secondary { font-size: 0.875rem; } .gemini-page .gemini-type-code, .gemini-page .gemini-type-code pre { font-family: var(--gemini-font-secondary); font-size: 0.75rem; font-weight: 400; line-height: 1.666em; padding: 0; } .gemini-page .gemini-type-l1, .gemini-page .gemini-type-l2 { font-family: var(--gemini-font-primary); text-transform: uppercase; font-weight: 700; line-height: 140%; letter-spacing: 0.0416666667em; } .gemini-page .gemini-type-l1 { font-size: 0.75rem; } .gemini-page .gemini-type-l2 { font-size: 0.75rem; } .gemini-page .gemini-type-l3 { font-size: 0.75rem; font-weight: 500; letter-spacing: 0; } @media (min-width: 834px) { .gemini-page .gemini-type-h3 { font-size: 2rem; letter-spacing: auto; } .gemini-page .gemini-type-h4 { font-size: 1.75rem; } .gemini-page .gemini-type-t1-medium { font-size: 1.25rem; } .gemini-page .gemini-type-t1 { font-size: 1.25rem; } .gemini-page .gemini-type-t2 { font-size: 1rem; line-height: 160%; } .gemini-page .gemini-type-t3 { font-size: 0.875rem; } .gemini-page .gemini-type-b1 { font-size: 1rem; } .gemini-page .gemini-type-b2 { font-size: 0.875rem; line-height: 160%; } .gemini-page .gemini-type-btn { font-size: 1rem; } .gemini-page .gemini-type-code, .gemini-page .gemini-type-code pre { line-height: 1.666em; font-size: 1rem; } .gemini-page .gemini-type-l1 { font-size: 0.875rem; } .gemini-page .gemini-type-l2 { font-size: 0.75rem; } .gemini-page .gemini-type-l3 { font-size: 0.75rem; } .gemini-page .gemini-type-d1 { font-size: 6.75rem; /*letter-spacing: -0.1875rem;*/ } .gemini-page .gemini-type-d2 { font-size: 6rem; } .gemini-page .gemini-type-d3 { font-size: 4.5rem; letter-spacing: -0.0111111111em; line-height: 110%; } .gemini-page .gemini-type-h1 { font-size: 2.8125rem; } .gemini-page .gemini-type-h2 { font-size: 2.25rem; } } .gemini-page { --gemini-space-8: 8px; --gemini-space-12: 12px; --gemini-space-16: 16px; --gemini-space-24: 24px; --gemini-space-32: 32px; --gemini-space-40: 40px; --gemini-space-48: 48px; --gemini-space-56: 56px; --gemini-space-64: 64px; --gemini-space-72: 72px; --gemini-space-80: 80px; --gemini-space-88: 88px; --gemini-space-96: 96px; --gemini-space-120: 120px; --gemini-space-140: 140px; --gemini-space-164: 164px; --gemini-space-180: 180px; --gemini-space-200: 200px; --gemini-space-220: 220px; --gemini-space-240: 240px; --gemini-space-264: 264px; --gemini-space-280: 280px; --gemini-space-320: 320px; --gemini-space-360: 360px; --gemini-space-440: 400px; --gemini-space-d8: var(--gemini-space-8); --gemini-space-d12: var(--gemini-space-12); --gemini-space-d16: var(--gemini-space-16); --gemini-space-d24: var(--gemini-space-16); --gemini-space-d32: var(--gemini-space-24); --gemini-space-d40: var(--gemini-space-32); --gemini-space-d48: var(--gemini-space-40); --gemini-space-d64: var(--gemini-space-48); --gemini-space-d72: var(--gemini-space-56); --gemini-space-d88: var(--gemini-space-64); --gemini-space-d120: var(--gemini-space-88); --gemini-space-d140: var(--gemini-space-120); --gemini-space-d180: var(--gemini-space-120); --gemini-space-d220: var(--gemini-space-180); --gemini-space-d264: var(--gemini-space-180); --gemini-space-d280: var(--gemini-space-200); --gemini-space-d320: var(--gemini-space-220); --gemini-space-d360: var(--gemini-space-240); --gemini-space-d440: var(--gemini-space-264); } @media (min-width: 834px) { .gemini-page { --gemini-space-d8: var(--gemini-space-8); --gemini-space-d12: var(--gemini-space-12); --gemini-space-d16: var(--gemini-space-16); --gemini-space-d24: var(--gemini-space-24); --gemini-space-d32: var(--gemini-space-32); --gemini-space-d40: var(--gemini-space-40); --gemini-space-d48: var(--gemini-space-48); --gemini-space-d64: var(--gemini-space-64); --gemini-space-d72: var(--gemini-space-72); --gemini-space-d88: var(--gemini-space-88); --gemini-space-d120: var(--gemini-space-120); --gemini-space-d140: var(--gemini-space-140); --gemini-space-d180: var(--gemini-space-180); --gemini-space-d220: var(--gemini-space-220); --gemini-space-d264: var(--gemini-space-264); --gemini-space-d280: var(--gemini-space-280); --gemini-space-d320: var(--gemini-space-320); --gemini-space-d360: var(--gemini-space-360); --gemini-space-d440: var(--gemini-space-440); } } .gemini-page .gemini-space-d8 { margin-block-end: var(--gemini-space-d8); } .gemini-page .gemini-space-d12 { margin-block-end: var(--gemini-space-d12); } .gemini-page .gemini-space-d16 { margin-block-end: var(--gemini-space-d16); } .gemini-page .gemini-space-d24 { margin-block-end: var(--gemini-space-d24); } .gemini-page .gemini-space-d32 { margin-block-end: var(--gemini-space-d32); } .gemini-page .gemini-space-d40 { margin-block-end: var(--gemini-space-d40); } .gemini-page .gemini-space-d48 { margin-block-end: var(--gemini-space-d48); } .gemini-page .gemini-space-d64 { margin-block-end: var(--gemini-space-d64); } .gemini-page .gemini-space-d72 { margin-block-end: var(--gemini-space-d72); } .gemini-page .gemini-space-d88 { margin-block-end: var(--gemini-space-d88); } .gemini-page .gemini-space-d120 { margin-block-end: var(--gemini-space-d120); } .gemini-page .gemini-space-d140 { margin-block-end: var(--gemini-space-d140); } .gemini-page .gemini-space-d164 { margin-block-end: var(--gemini-space-d164); } .gemini-page .gemini-space-d180 { margin-block-end: var(--gemini-space-d180); } .gemini-page .gemini-space-d220 { margin-block-end: var(--gemini-space-d220); } .gemini-page .gemini-space-d264 { margin-block-end: var(--gemini-space-d264); } .gemini-page .gemini-space-d280 { margin-block-end: var(--gemini-space-d280); } body[theme=googledevai-theme][layout=full] .devsite-main-content { max-width: none; padding-bottom: 0; background-color: #060606; } body[theme=googledevai-theme][layout=full] .devsite-article-body { margin-top: 0; background-color: var(--gemini-color-background); } body[theme=googledevai-theme] .devsite-banner-announcement { position: relative; z-index: 10; } devsite-header .devsite-product-id-row { display: none; } .gemini-page .gemini-decoration-link { text-decoration: underline; color: var(--gemini-color-blue-400); display: inline-flex; align-items: center; gap: var(--gemini-space-8); } .gemini-page .gemini-layout-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); column-gap: var(--gemini-size-grid-gap); } .gemini-page .gemini-layout-max-width { max-inline-size: var(--gemini-size-max-width); padding-inline: var(--gemini-size-grid-margin); margin-inline: auto; } .gemini-page .gemini-layout-zstack { display: grid; } .gemini-page .gemini-layout-zstack > * { grid-area: 1/-1; } .gemini-page .gemini-layout-inline { display: inline-flex; flex-direction: row; align-items: center; gap: var(--gemini-space, 8px); } .gemini-page .gemini-layout-stack { display: flex; flex-direction: column; justify-content: flex-start; } .gemini-page .gemini-layout-stack > * { margin-block: 0; } .gemini-page .gemini-layout-stack > * + * { margin-block-start: var(--gemini-space, 1rem); } .gemini-page .gemini-shape-box { border-radius: var(--gemini-corner-radius-medium); } .gemini-page .gemini-shape-rounded-container { border-radius: 24px; } .gemini-page .gemini-shape-pill-label { display: inline-flex; align-items: center; background: var(--gemini-shape-pill-background, rgba(7, 110, 255, 0.2)); color: var(--gemini-label-color, #b1c5ff); padding: 6px 11px; border-radius: 99em; } @media (min-width: 834px) { .gemini-page .gemini-layout-grid { grid-template-columns: repeat(8, minmax(0, 1fr)); } } @media (min-width: 1024px) { .gemini-page .gemini-layout-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); } } /** Gemini: Gradient Text */ .gemini-gradient-text { --gemini-_gradient: var(--gemini-text-gradient, var(--gemini-color-blue-gradient)); } .gemini-gradient-text span { background: var(--gemini-_gradient); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; text-fill-color: transparent; } /** Gemini: Youtube Video */ .gemini-youtube { position: relative; inline-size: 100%; aspect-ratio: 16/9; overflow: hidden; border-radius: 8px; border: 4px solid var(--gemini-color-grey-800); transition: border 0.2s var(--gemini-ease-in-out-quad); --gemini-hover-scale: 0.1; } .gemini-youtube:has(:hover) { border: 4px solid var(--gemini-color-blue); } .gemini-youtube:has(:hover) .gemini-youtube__play-button { transform: scale(calc(1 + var(--gemini-hover-scale))); } @media (min-width: 834px) { .gemini-youtube { border-radius: 32px; } } .gemini-youtube-poster { cursor: pointer; line-height: 0; } .gemini-youtube-poster :is(img, video) { height: 100%; width: 100%; } .gemini-video-overlay { display: flex; align-items: center; flex-direction: column; justify-content: center; gap: 12px; cursor: pointer; background-color: rgba(0, 0, 0, 0.05); pointer-events: none; } @media (min-width: 834px) { .gemini-video-overlay { gap: 48px; } } .gemini-youtube__title { max-width: 214px; display: inline-block; text-align: center; position: relative; z-index: 5; } @media (min-width: 834px) { .gemini-youtube__title { max-width: 620px; } } @media (max-width: 834px) { .gemini-youtube__title { font-size: 26px !important; } } .gemini-youtube__play-button { all: unset; height: 32px; width: 32px; border-radius: 50%; background: var(--gemini-color-white); display: grid; place-items: center; position: relative; z-index: 5; transition: transform 0.3s var(--gemini-ease-in-out-quad); box-shadow: 0 4px 8px 3px rgba(60, 64, 67, 0.15), 0 1px 3px 0 rgba(60, 64, 67, 0.32); } @media (min-width: 834px) { .gemini-youtube__play-button { height: 64px; width: 64px; } } .gemini-youtube__play-button svg { height: 16px; width: 16px; } @media (min-width: 834px) { .gemini-youtube__play-button svg { height: 28px; width: 28px; } } @media (min-width: 834px) { .gemini-anchor-padding { padding-block-start: 40px; } } @media (min-width: 834px) { .gemini-only-mobile { display: none; } } .gemini-only-desktop { display: none; } @media (min-width: 834px) { .gemini-only-desktop { display: block; } } /* Spinner */ .gemini-spinner { block-size: 48px; inline-size: 48px; flex-shrink: 0; animation: gemini-spinner-animation 1.6s linear infinite; } @keyframes gemini-spinner-animation { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /* Gemini: Item grid */ .gemini-page .gemini-card-grid { row-gap: 8px; } @media (min-width: 834px) { .gemini-page .gemini-card-grid { row-gap: var(--gemini-size-grid-gap); } } .gemini-page .gemini-card-grid > * { grid-column: -1/1; } @media screen and (min-width: 834px) { .gemini-page .gemini-card-grid > * { grid-column: span 4/span 8; } } @media screen and (min-width: 1024px) { .gemini-page .gemini-card-grid > * { grid-column: span 4/span 12; } } .gemini-page .gemini-layout-small-card { align-items: flex-start; display: flex; padding: 24px; block-size: 100%; } @media screen and (min-width: 600px) { .gemini-page .gemini-layout-small-card { padding-block: 32px; padding-inline: 32px 40px; } } .gemini-page .gemini-layout-small-card.gemini-has-icon { gap: 24px; } @media screen and (min-width: 600px) { .gemini-page .gemini-layout-small-card.gemini-has-icon { gap: 32px; } } .gemini-page .gemini-layout-small-card.gemini-has-icon .gemini-icon { flex-shrink: 0; inline-size: 32px; line-height: 0; } .gemini-page a.gemini-reset-link { text-decoration: none; color: inherit; } .gemini-page .gemini-lottie-lines svg path { vector-effect: non-scaling-stroke; stroke-width: 1.5px !important; } /* ARROW LINK */ .gemini-arrow-link { color: var(--gemini-link-color, var(--gemini-color-white)); display: inline-flex; position: relative; text-decoration: none; text-underline-offset: 3px; justify-content: center; } .gemini-arrow-link .gemini-arrow { display: inline-block; inline-size: 16px; inset-block-start: calc(50% - 8px); inset-inline-start: calc(100% + 3px); line-height: 0; position: absolute; } .gemini-arrow-link:hover { text-decoration: underline; } /* Gemini Pill Button */ .gemini-page .gemini-btn { --gemini-_border: var(--gemini-button-border, var(--gemini-color-grey-600)); --gemini-_background: var(--gemini-button-fill, transparent); --gemini-_text: var(--gemini-button-text, inherit); border: 0; appearance: none; text-decoration: none; position: relative; cursor: pointer; color: var(--gemini-_text); background-color: var(--gemini-_background); user-select: none; display: inline-flex; justify-content: center; align-items: center; border-radius: 99em; padding: 15px 24px; leading-trim: both; height: auto; } .gemini-page .gemini-btn span { position: relative; z-index: 1; } .gemini-page .gemini-btn::before { position: absolute; content: ""; inset: 0; border-radius: inherit; will-change: opacity; transition-property: opacity; transition-duration: 0.25s; opacity: 0; } .gemini-page .gemini-btn:hover::before { opacity: 1; } .gemini-page .gemini-btn.gemini-disabled { pointer-events: none; opacity: 0.5; } .gemini-page .gemini-btn.gemini-has--icon > span { display: inline-flex; align-items: center; gap: var(--gemini-icon-gap, 12px); } /* Gemini Primary Button */ .gemini-page .gemini-btn.gemini-primary { --gemini-_text: var(--gemini-button-text, var(--gemini-color-white)); --gemini-_background: var(--gemini-button-fill, var(--gemini-color-gemini-blue)); } .gemini-page .gemini-btn.gemini-primary::before { background-color: var(--gemini-color-blue); box-shadow: 0 1px 2px 0 rgba(60, 64, 67, 0.3), 0 1px 3px 1px rgba(60, 64, 67, 0.15); } .gemini-page .gemini-btn.gemini-primary:hover::before { opacity: 1; } /* Gemini Secondary Button */ .gemini-page .gemini-btn.gemini-secondary { border: 1px solid var(--gemini-_border); transition: color 0.18s ease-in-out, background 0.2s ease-in-out; } .gemini-page .gemini-btn.gemini-secondary::before { background-color: var(--gemini-button-hover, rgba(255, 255, 255, 0.09)); } /* Gemini Tertiary Button */ .gemini-page .gemini-btn.gemini-tertiary { --gemini-_text: var(--gemini-button-text, var(--gemini-color-white)); padding-inline: 20px; padding-block: 10px; transition: transform 0.18s ease-in-out, background 0.2s ease-in-out, color 0.2s ease-in-out; border: 1px solid var(--gemini-_border); } .gemini-page .gemini-btn.gemini-tertiary:hover { background: var(--gemini-button-hover-background, var(--gemini-color-white)); color: var(--gemini-button-hover-text, var(--gemini-color-black)); } .gemini-page .gemini-btn.gemini-tertiary.gemini-has--icon { padding-inline: 18px 20px; } .gemini-page .gemini-btn.gemini-tertiary.gemini-has--icon > span { gap: 8px; } .gemini-page .gemini-btn.gemini-tertiary::before { background-color: var(--gemini-button-hover); } /* Gemini Gradient Button */ .gemini-page .gemini-btn.gemini-gradient { position: relative; --gemini-_background: var( --gemini-button-fill, var(--gemini-color-primary-button-gradient) ); background-image: var(--gemini-_background); transition: color 0.18s; } .gemini-page .gemini-btn.gemini-gradient::before { background: var(--gemini-button-hover-background, var(--gemini-color-white)); } .gemini-page .gemini-btn.gemini-gradient:hover { color: var(--gemini-button-hover-color, var(--gemini-color-blue, #368efe)); } .gemini-page .gemini-btn.gemini-gradient:hover::before { opacity: 1; } @media (min-width: 834px) { .gemini-page .gemini-btn { padding-block: 16px; } } /* CARD LIST */ .gemini-card-list { display: flex; flex-direction: column; row-gap: 12px; } @media screen and (min-width: 834px) { .gemini-card-list { row-gap: 16px; } } /* CARD GRID */ .gemini-cards-wrapper { display: grid; gap: 12px; grid-template-columns: repeat(1, 1fr); } @media screen and (min-width: 834px) { .gemini-cards-wrapper { gap: var(--gemini-size-grid-gap); } } @media screen and (min-width: 834px) { .gemini-cards-wrapper.gemini-row-of-two { grid-template-columns: repeat(2, 1fr); } } .gemini-cards-wrapper.gemini-row-of-two > * { grid-column: 1 span/auto; } /* GEMINI CARD GRID LIST */ .gemini-card-grid-list { --_gemini-colunm-amount: var(--gemini-grid-colunm-amount, 1); display: grid; gap: 12px; grid-template-columns: repeat(var(--_gemini-colunm-amount), 1fr); } @media screen and (min-width: 1024px) { .gemini-card-grid-list { --_gemini-colunm-amount: var(--gemini-grid-colunm-amount, 2); gap: var(--gemini-size-grid-gap); } .gemini-card-grid-list.gemini-row-of-three { --gemini-grid-colunm-amount: 3; } .gemini-card-grid > * { grid-column: 2 span/auto; } } /* GUIDE CARD LIST */ .gemini-card-guides { align-items: stretch; display: flex; flex-direction: column; gap: 12px; } .gemini-card-guides > * { flex-basis: 100%; inline-size: 100%; } @media screen and (min-width: 1024px) { .gemini-card-guides { flex-direction: row; flex-wrap: wrap; gap: var(--gemini-size-grid-gap); justify-content: center; } .gemini-card-guides > * { flex-basis: calc(33.3333333333% - var(--gemini-size-grid-gap) * 2); flex-grow: 1; min-width: 250px; } } /* BACKGROUND WRAPPER */ .gemini-background-wrapper { background-position: center; background-repeat: no-repeat; background-size: cover; border-radius: var(--gemini-border-radius-d32); display: block; inline-size: 100%; overflow: hidden; padding-block: var(--gemini-wrapper-padding-top, var(--gemini-space-d120)); padding-inline: 24px; position: relative; } @media (min-width: 1024px) { .gemini-background-wrapper { padding-inline: 0; } } .gemini-background-wrapper.gemini-background-dark { --gemini-section-copy-color: var(--gemini-color-grey-400); background-image: url("/images/system/wrapper-background-dark.jpg"); border: 1px solid var(--gemini-wrapper-border-color, var(--gemini-color-grey-700)); } .gemini-background-wrapper.gemini-background-dark .gemini-gradient-CTA_wrapper { background-image: none; background-color: var(--gemini-color-grey-800); } .gemini-background-wrapper.gemini-background-light-blue { --gemini-section-copy-color: var(--gemini-color-white); --gemini-section-title-color: var(--gemini-color-white); background-image: url("/images/system/wrapper-background-light-blue.jpg"); } .gemini-background-wrapper.gemini-background-green { --gemini-section-copy-color: var(--gemini-color-white); --gemini-section-copy-color: var(--gemini-color-grey-400); background-image: url("/images/system/wrapper-background-green.jpg"); border: 1px solid var(--gemini-wrapper-border-color, var(--gemini-color-green-800)); } .gemini-background-wrapper.gemini-background-dark-blue { --gemini-section-copy-color: var(--gemini-color-white); --gemini-section-copy-color: var(--gemini-color-grey-400); background-image: url("/images/system/wrapper-background-dark-blue.jpg"); border: 1px solid var(--gemini-wrapper-border-color, var(--gemini-color-blue-800)); } /* GEMINI TEXT LIST */ .gemini-text-list.gemini-layout-grid { row-gap: 0; } .gemini-text-list.gemini-has-animation .gemini-text-list-headline, .gemini-text-list.gemini-has-animation .gemini-text-list-item { opacity: 0; transform: translateY(20px); will-change: transform; transition-property: opacity, transform; transition-duration: 0.5s, 0.6s; transition-delay: calc(var(--gemini-text-animation-delay) * 0.12s + 0.3s); transition-timing-function: var(--gemini-ease-out-quad); } .gemini-text-list.gemini-has-animation.gemini-onscreen .gemini-text-list-headline, .gemini-text-list.gemini-has-animation.gemini-onscreen .gemini-text-list-item { opacity: 1; transform: translateY(0); } .gemini-text-list .gemini-text-list-headline, .gemini-text-list .gemini-text-list-wrapper { grid-column: 1/-1; } @media (min-width: 834px) { .gemini-text-list .gemini-text-list-headline, .gemini-text-list .gemini-text-list-wrapper { grid-column: 2/span 6; } } @media (min-width: 1024px) { .gemini-text-list .gemini-text-list-headline, .gemini-text-list .gemini-text-list-wrapper { grid-column: 3/span 8; } } .gemini-text-list .gemini-text-list-headline { text-align: center; } .gemini-text-list .gemini-text-list-item { display: grid; grid-template-columns: repeat(8, 1fr); padding-block: 16px 32px; border-top: 1px solid var(--gemini-color-grey-700); column-gap: var(--gemini-size-grid-gap); row-gap: 8px; } @media (min-width: 834px) { .gemini-text-list .gemini-text-list-item { padding-block: 24px 40px; } } .gemini-text-list .gemini-text-list-item .gemini-title-wrapper { grid-column: 1/-1; } @media (min-width: 834px) { .gemini-text-list .gemini-text-list-item .gemini-title-wrapper { grid-column: span 3/auto; } .gemini-text-list .gemini-text-list-item .gemini-title-wrapper > * { max-inline-size: 202px; } } .gemini-text-list .gemini-text-list-item .gemini-description-wrapper { grid-column: 1/-1; } .gemini-text-list .gemini-text-list-item .gemini-description-wrapper > * { max-inline-size: 450px; color: var(--gemini-color-grey-400); } @media (min-width: 834px) { .gemini-text-list .gemini-text-list-item .gemini-description-wrapper { grid-column: span 5/auto; } } /* GEMINI CARD GRID ITEM */ .gemini-card-grid-item .gemini-card-content { --_gemini-card-arrow-color: var(--gemini-card-arrow-color, var(--gemini-color-blue)); --_gemini-copy-color: var(--gemini-card-description-color, var(--gemini-color-grey-400)); align-items: flex-start; color: inherit; display: flex; flex-direction: column; gap: 16px; position: relative; text-decoration: none; } @media (min-width: 834px) { .gemini-card-grid-item .gemini-card-content { gap: 24px; } } .gemini-card-grid-item .gemini-card-content.gemini-card-layout-default { --_gemini-card-logo-size: 64px; flex-direction: column; padding: 24px; } .gemini-card-grid-item .gemini-card-content.gemini-card-layout-default .gemini-card-link-decorator { inset-block-start: 24px; inset-inline-end: 24px; } @media (min-width: 834px) { .gemini-card-grid-item .gemini-card-content.gemini-card-layout-default { --_gemini-card-logo-size: 126px; align-items: center; flex-direction: row; padding-block: 16px; padding-inline: 16px 32px; } .gemini-card-grid-item .gemini-card-content.gemini-card-layout-default .gemini-card-link-decorator { inset-block-start: 16px; inset-inline-end: 16px; } } .gemini-card-grid-item .gemini-card-content.gemini-card-layout-compact { --_gemini-card-logo-size: 44px; align-items: center; flex-direction: row; padding-block: 16px; padding-inline: 16px 24px; } @media (min-width: 834px) { .gemini-card-grid-item .gemini-card-content.gemini-card-layout-compact { --_gemini-card-logo-size: 86px; padding-inline-end: 32px; } } .gemini-card-grid-item .gemini-card-content.gemini-theme-light-blue { --gemini-card-description-color: var(--gemini-color-grey-100); --gemini-card-arrow-color: var(--gemini-color-white); } .gemini-card-grid-item .gemini-card-link-decorator { inset-block-start: 16px; inset-inline-end: 16px; position: absolute; color: var(--_gemini-card-arrow-color); } .gemini-card-grid-item figure { display: inline-block; flex-shrink: 0; inline-size: var(--_gemini-card-logo-size); line-height: 0; } .gemini-card-grid-item figure img { max-inline-size: 100%; } .gemini-card-grid-item .gemini-card-description { color: var(--_gemini-copy-color); } .gemini-value-card { text-align: center; } .gemini-value-card.gemini-with-background { background-image: url("/images/system/value-card-background-dark.jpg"); background-repeat: no-repeat; background-size: cover; background-position: center; border-radius: var(--gemini-border-radius-d24); overflow: hidden; padding-block: 40px; padding-inline: 24px; } @media (min-width: 834px) { .gemini-value-card.gemini-with-background { padding-inline: 40px; padding-block: 64px; } .gemini-value-card.gemini-with-background.gemini-with-icon { padding-block: 48px 64px; } } .gemini-value-card.gemini-with-background .gemini-card-icon { inline-size: 40px; margin-inline: auto; } @media (min-width: 834px) { .gemini-value-card.gemini-with-background .gemini-card-icon { inline-size: 48px; } } .gemini-value-card .gemini-card-description { color: var(--gemini-color-grey-400); } .gemini-feature-card { --_gemini-icon-size: 44px; } @media screen and (min-width: 834px) { .gemini-feature-card { --_gemini-icon-size: 64px; } } .gemini-feature-card .gemini-card-icon { inline-size: var(--gemini-card-icon-size, var(--_gemini-icon-size)); margin-inline: auto; } /* GUIDE CARD CENTERED ITEM */ .gemini-card-centered { --gemini-button-border: var(--gemini-color-grey-700); align-items: center; color: var(--gemini-color-white); display: flex; flex-direction: column; overflow: hidden; padding: 24px; text-align: center; text-decoration: none; } @media (min-width: 834px) { .gemini-card-centered { padding: 32px 24px; block-size: 100%; } } .gemini-card-centered.gemini-theme-light-blue { --gemini-card-description-color: var(--gemini-color-grey-100); --gemini-card-arrow-color: var(--gemini-color-white); --gemini-button-border: rgba(246, 248, 250, 0.5); } .gemini-card-centered .gemini-card-icon { align-items: center; block-size: 40px; inline-size: 40px; line-height: 0; } @media screen and (min-width: 834px) { .gemini-card-centered .gemini-card-icon { block-size: 56px; inline-size: 56px; } } .gemini-card-centered .gemini-card-title { color: var(--gemini-color-white); padding-inline: 26px; } .gemini-card-centered .gemini-card-content { color: var(--gemini-card-description-color, var(--gemini-color-grey-400)); } .gemini-card-centered .gemini-btn { --gemini-button-fill: transparent; --gemini-button-text: var(--gemini-color-white); margin-top: auto; } .gemini-card-centered:hover .gemini-btn { background: var(--gemini-color-white); color: var(--gemini-color-grey-900); } /** Gemini Section: CTA */ .gemini-section-cta { --gemini-_subtitle-color: var( --gemini-section-subtitle-color, var(--gemini-color-grey-500) ); --gemini-_text-alignment: var(--gemini-section-text-alignment, center); --gemini-_section-margin: var(--gemini-section-margin, 0 auto); --gemini-_title-color: var(--gemini-section-title-color, var(--gemini-color-grey-100)); --devsite-heading-color: var(--gemini-_title-color); --gemini-_copy-color: var(--gemini-section-copy-color, var(--gemini-color-grey-400)); --gemini-animation-ease: var(--gemini-ease-out-quad); --gemini-animation-duration: 0.5s; --gemini-animation-stagger: 0.16s; --gemini-animation-delay: 0s; --gemini-_title-order: calc(var(--gemini-animation-title-order, 2) - 1); --gemini-_copy-order: calc(var(--gemini-animation-copy-order, 3) - 1); --gemini-_buttons-order: calc(var(--gemini-animation-buttons-order, 4) - 1); --gemini-_heading-max-width: var(--gemini-heading-max-width, 630px); --gemini-_copy-max-width: var(--gemini-copy-max-width, 630px); } .gemini-section-cta .gemini-cta { text-align: var(--gemini-_text-alignment); } .gemini-section { outline: none; } .gemini-section-cta .gemini-section { margin: var(--gemini-_section-margin); } .gemini-section-cta .gemini-section__subtitle { color: var(--gemini-_subtitle-color); clip-path: fill-box; } .gemini-section-cta .gemini-section__subtitle > * { display: block; transform: translateY(100px); opacity: 0; transition: transform var(--gemini-animation-duration) calc(var(--gemini-animation-stagger) + var(--gemini-animation-delay)) var(--gemini-animation-ease), opacity 0.1s linear; } .gemini-section-cta .gemini-onscreen .gemini-section__subtitle > * { transform: translateY(0%); opacity: 1; } .gemini-section-cta .gemini-section__title { color: var(--gemini-_title-color); clip-path: fill-box; max-inline-size: var(--gemini-_heading-max-width); } .gemini-section-cta .gemini-section__title > * { display: block; transform: translateY(100%); transition: transform var(--gemini-animation-duration) calc(var(--gemini-animation-stagger) * var(--gemini-_title-order) + var(--gemini-animation-delay)) var(--gemini-animation-ease); padding-block-end: 0.04em; } .gemini-section-cta .gemini-section__title h1:first-of-type { display: block; } .gemini-section-cta .gemini-onscreen .gemini-section__title > * { transform: translateY(0%); } .gemini-section-cta .gemini-section__copy { color: var(--gemini-_copy-color); max-inline-size: var(--gemini-_copy-max-width); transform: translateY(60px); opacity: 0; transition: transform var(--gemini-animation-duration) calc(var(--gemini-animation-stagger) * var(--gemini-_copy-order) + var(--gemini-animation-delay)) var(--gemini-animation-ease), opacity 0.05s calc(var(--gemini-animation-stagger) * var(--gemini-_copy-order) + var(--gemini-animation-delay)) linear; } .gemini-section-cta .gemini-onscreen .gemini-section__copy { transform: translateY(0%); opacity: 1; } .gemini-section-cta .gemini-section__buttons { display: flex; gap: 12px; align-items: center; flex-direction: column; transform: translateY(60px); opacity: 0; transition: transform 0.5s calc(var(--gemini-animation-stagger) * var(--gemini-_buttons-order)) var(--gemini-animation-ease), opacity 0.15s calc(var(--gemini-animation-stagger) * var(--gemini-_buttons-order)) linear; } .gemini-section-cta .gemini-onscreen .gemini-section__buttons { transform: translateY(0%); opacity: 1; } @media (min-width: 768px) { .gemini-section-cta .gemini-section__buttons { justify-content: center; flex-direction: row; } } /** Gemini: Animated Rings */ .gemini-animated-rings-element { --gemini-_large-ring-size: min( max( var(--gemini-large-ring-size, 87.5vw), var(--gemini-large-ring-min-size, 872px) ), var(--gemini-large-ring-max-size, 1260px) ); --gemini-_small-ring-size: min( max( var(--gemini-small-ring-size, 77.5vw), var(--gemini-small-ring-min-size, 770px) ), var(--gemini-small-ring-max-size, 1116px) ); --gemini-_small-ring-animation-duration: var(--gemini-small-ring-animation-duration, 16s); --gemini-_large-ring-animation-duration: var(--gemini-large-ring-animation-duration, 10s); } .gemini-animated-rings-element { display: block; block-size: 10px; inline-size: 10px; pointer-events: none; position: absolute; inset-block-start: calc(50% - 1px); inset-inline-start: calc(50% - 1px); } .gemini-animated-rings-element .gemini-small-ring { display: block; inline-size: var(--gemini-_small-ring-size); block-size: var(--gemini-_small-ring-size); position: absolute; inset-inline-start: calc(var(--gemini-_small-ring-size) * -0.5); inset-block-start: calc(var(--gemini-_small-ring-size) * -0.5); transform: scale(0); transition: transform 1.6s 0.1s var(--gemini-ease-out-quart); } .gemini-animated-rings-element .gemini-small-ring > * { display: block; animation: gemini-animated-rings-spin var(--gemini-_small-ring-animation-duration) linear infinite; } .gemini-animated-rings-element .gemini-large-ring { inline-size: var(--gemini-_large-ring-size); block-size: var(--gemini-_large-ring-size); position: absolute; inset-inline-start: calc(var(--gemini-_large-ring-size) * -0.5); inset-block-start: calc(var(--gemini-_large-ring-size) * -0.5); transform: scale(0); transition: transform 1.6s var(--gemini-ease-out-quart); } .gemini-animated-rings-element .gemini-large-ring > * { display: block; animation: gemini-animated-rings-spin var(--gemini-_large-ring-animation-duration) linear infinite reverse; } .gemini-animated-rings-element .gemini-onscreen .gemini-small-ring, .gemini-animated-rings-element .gemini-onscreen .gemini-large-ring { transform: scale(1); } @keyframes gemini-animated-rings-spin { 0% { transform: rotateZ(0deg); } 100% { transform: rotateZ(360deg); } } .gemini-section-ring-container { --_gemini-rings-offset-y: var(--gemini-rings-section-offset-y, -50%); block-size: 100vw; inline-size: 100vw; left: 50%; max-height: 1300px; max-width: 1300px; min-height: 872px; overflow: hidden; position: absolute; top: 50%; transform: translate(-50%, var(--_gemini-rings-offset-y)); z-index: 0; display: none; } @media (min-width: 600px) { .gemini-section-ring-container { display: block; } } @media (min-width: 834px) { .gemini-section-ring-container { inline-size: calc(100vw - 20px); block-size: calc(100vw - 20px); } } .gemini-section-ring-container .gemini-rings { position: absolute; top: 0; left: 0; right: 0; bottom: 0; pointer-events: none; } /* RING GRADIENT COVER */ .gemini-has-ring { position: relative; z-index: 4; } .gemini-gradient-cover--top, .gemini-gradient-cover--bottom { position: relative; z-index: 7; background: var(--gemini-color-background); } .gemini-gradient-cover--top *, .gemini-gradient-cover--bottom * { position: relative; z-index: 7; } .gemini-gradient-cover--top:before, .gemini-gradient-cover--bottom:after { content: ""; position: absolute; inset-inline-start: 50%; block-size: var(--gemini-gradient-height, 300px); inline-size: 97vw; max-inline-size: 1440px; pointer-events: none; z-index: 1; display: none; } @media (min-width: 600px) { .gemini-gradient-cover--top:before, .gemini-gradient-cover--bottom:after { display: block; } } @media (min-width: 834px) { .gemini-gradient-cover--top:before, .gemini-gradient-cover--bottom:after { block-size: var(--gemini-gradient-height, 450px); } } .gemini-gradient-cover--top:before { inset-block-start: 0; transform: translate(-50%, var(--gemini-gradient-y, -60%)); background: linear-gradient(0, #060606 50%, rgba(6, 6, 6, 0) 100%); /*#060606*/ } .gemini-gradient-cover--bottom:after { inset-block-end: 0; transform: translate(-50%, var(--gemini-gradient-y, 50%)); background: linear-gradient(180deg, #060606 50%, rgba(6, 6, 6, 0) 100%); /*#060606*/ } /** Gradient Box */ .gemini-gradient-box { --_gemini-box-radius: var(--gemini-gradient-box-radius, 16px); --_gemini-border-width: var(--gemini-gradient-box-border-width, 2px); --_box-border-color: var(--gradient-box-border-color, linear-gradient( 93deg, #076eff 0%, #0c0c0d 33%, #076eff 68.5%, #0c0c0d 98.75% )); background: var(--_box-border-color); border-radius: var(--_gemini-box-radius); bottom: 0; content: ""; display: block; left: 0; margin: 0; position: relative; right: 0; top: 0; transition: background 0.3s ease; } @media (min-width: 834px) { .gemini-gradient-box { --_gemini-box-radius: var(--gemini-gradient-box-radius, 32px); } } .gemini-gradient-box_wrapper { background-clip: padding-box; background-color: #060606; background-image: var(--_gemini-gradient-background); background-position: center center; background-repeat: no-repeat; background-size: 110% 110%; border-radius: var(--_gemini-box-radius); border: solid var(--_gemini-border-width) transparent; box-sizing: border-box; height: 100%; margin: 0; padding: 2px; position: relative; transform: translate3d(0, 0, 0); width: 100%; } .gemini-gradient-box__inner { border-radius: var(--_gemini-box-radius); height: 100%; width: 100%; } .gemini-gradient-box--custom { --_box-border-color: var(--gradient-box-border-color); --_gemini-gradient-background: var(--gemini-box-gradient-background); } .gemini-gradient-box--blue { --_gemini-gradient-background: var( --gemini-box-gradient-background, url("/images/gradient-box-blue.jpg") ); --_box-border-color: var(--gradient-box-border-color, linear-gradient(320deg, #2E64DE -17.73%, #3C8FE3 50.43%)); --gemini-text-gradient: linear-gradient(61deg, #64B8FB 6.28%, #217BFE 76.97%); } .gemini-gradient-box--pink { --_gemini-gradient-background: var( --gemini-box-gradient-background, url("/images/gradient-box-pink.jpg") ); --_box-border-color: var(--gradient-box-border-color, linear-gradient(313deg, #987BE9 -24.05%, #BE6EAE 92.91%)); --gemini-text-gradient: linear-gradient(90deg, #A485FA -104.88%, #EE4D5D 198.78%); } .gemini-gradient-box--w1 { --_gemini-border-width: 1px; } .gemini-gradient-box--grey { --_gemini-gradient-background: var( --gemini-box-gradient-background, url("/images/gradient-box-grey.png") ); --_box-border-color: var(--gradient-box-border-color, linear-gradient(299deg, #B1C5FF 10.12%, #D2DEFF 82.36%)); --gemini-text-gradient: var(--gemini-text-gradient-light-blue); } /* Gradient CTA */ .gemini-gradient-CTA { --_gemini-box-radius: var(--gemini-gradient-CTA-radius, 16px); --_box-border-color: none; --_gemini-border-width: 1px; background: var(--gemini-gradient-CTA-idle-border-color, linear-gradient(140deg, #151515 0.72%, #060606 100%)); border-radius: var(--_gemini-box-radius); bottom: 0; content: ""; display: block; left: 0; margin: 0; position: relative; right: 0; top: 0; } .gemini-gradient-CTA.gemini-with-hover { cursor: pointer; transition: background 0.3s ease; } @media (min-width: 834px) { .gemini-gradient-CTA { --_gemini-box-radius: var(--gemini-gradient-CTA-radius, 24px); --_gemini-border-width: 1px; } } @media (hover: hover) { .gemini-gradient-CTA.gemini-with-hover:hover .gemini-gradient-CTA_wrapper { border: var(--_gemini-border-width) solid transparent; transition: border 0.3s ease-out, background 0.3s ease-out; } .gemini-gradient-CTA.gemini-with-hover:hover::before { opacity: 0.9; transition: opacity 0.3s ease-out; } } .gemini-gradient-CTA::before { background: var(--_box-border-color); border-radius: var(--_gemini-box-radius); content: ""; height: 100%; opacity: 0; position: absolute; top: 0; transition: opacity 0.3s ease-out; width: 100%; } .gemini-gradient-CTA .gemini-gradient-CTA_wrapper::after { content: ""; position: absolute; block-size: 100%; inline-size: 100%; inset-block-start: 0; inset-inline-start: 0; border-radius: var(--_gemini-box-radius); transition: opacity 0.3s ease-out; z-index: 1; opacity: 0; background-image: var(--_gemini-gradient-hover-background); background-repeat: no-repeat; background-size: 110% 110%; background-position: center center; } .gemini-gradient-CTA_wrapper { --_gemini-gradient-background: var(--gemini-gradient-background, none); --_gemini-gradient-hover-background: var(--gemini-gradient-hover-background, none); transform: translate3d(0, 0, 0); margin: 0; width: 100%; height: 100%; position: relative; box-sizing: border-box; background-clip: padding-box; border: var(--_gemini-border-width) solid var(--gemini-gradient-CTA-idle-border-color, var(--gemini-color-grey-700, #202228)); border-radius: var(--_gemini-box-radius); transition: border 0.3s ease-out, background, 0.4s; background-image: var(--_gemini-gradient-background); background-repeat: no-repeat; background-size: 110% 110%; background-position: center center; } .gemini-gradient-CTA__inner { width: 100%; height: 100%; border-radius: calc(var(--_gemini-box-radius) - 2px); background: linear-gradient(121deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0) 101.29%); position: relative; z-index: 5; } .gemini-gradient-CTA--blue { --gemini-gradient-background: url("/images/system/card-list-item-background-dark.jpg"); --gemini-gradient-hover-background: url("/images/system/card-list-item-hover-dark.jpg"); --_box-border-color: var(--gradient-CTA-border-color, var(--gemini-color-blue-gradient)); } .gemini-gradient-CTA--blue.gemini-with-hover:hover .gemini-gradient-CTA_wrapper:after { opacity: 1; } .gemini-gradient-CTA--blue .gemini-gradient-CTA__inner { background: none; } .gemini-gradient-CTA--light-blue { --_box-border-color: transparent; background: linear-gradient(180deg, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 0.08) 100%); --gemini-gradient-CTA-idle-border-color: #7aa3ff; } .gemini-gradient-CTA--light-blue::before { border: var(--_gemini-border-width) solid var(--gemini-color-white); } /** Gemini: Partner Container */ .gemini-partner-container-element { display: block; } .gemini-partner-container-element section { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; } /** Gemini: Partner Item */ .gemini-partner-item .gemini-item { --gemini-_size: var(--gemini-partner-item-size, 160px); --gemini-border-width: 1; --gemini-border-radius: 8; --gemini-hover-alpha: 0.2; block-size: var(--gemini-_size); inline-size: var(--gemini-_size); text-decoration: none; user-select: none; position: relative; border-radius: calc(var(--gemini-border-radius) * 1px); display: grid; place-items: center; white-space: nowrap; } @media (min-width: 834px) { .gemini-partner-item .gemini-item { --gemini-_size: var(--gemini-partner-item-size, 170px); } } .gemini-partner-item .gemini-item::before { content: ""; position: absolute; inset: 0; border: calc(var(--gemini-border-width) * 1px) solid transparent; border-radius: calc(var(--gemini-border-radius) * 1px); -webkit-mask-image: linear-gradient(hsla(0, 0%, 100%, 0), hsla(0, 0%, 100%, 0)), linear-gradient(hsl(0, 0%, 100%), hsl(0, 0%, 100%)); -webkit-mask-clip: padding-box, border-box; -webkit-mask-composite: source-in, xor; mask-image: linear-gradient(hsla(0, 0%, 100%, 0), hsla(0, 0%, 100%, 0)), linear-gradient(hsl(0, 0%, 100%), hsl(0, 0%, 100%)); mask-clip: padding-box, border-box; mask-composite: intersect; z-index: 2; } .gemini-partner-item .gemini-item::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to right, rgb(255 255 255/var(--gemini-hover-alpha)), transparent); border: calc(var(--gemini-border-width) * 1px) solid transparent; border-radius: calc(var(--gemini-border-radius) * 1px); z-index: 1; opacity: 0; transition: opacity 0.35s ease-in-out; } .gemini-partner-item .gemini-item:hover .gemini-spark, .gemini-partner-item .gemini-item:focus-visible .gemini-spark { opacity: 1; } .gemini-partner-item .gemini-item:hover .gemini-spark::before, .gemini-partner-item .gemini-item:focus-visible .gemini-spark::before { opacity: 1; animation: gemini-item-spin 0.82s linear forwards; } .gemini-partner-item .gemini-item:hover::after, .gemini-partner-item .gemini-item:focus-visible::after { opacity: 1; } .gemini-partner-item .gemini-item.gemini-link { cursor: pointer; } .gemini-partner-item .gemini-item.gemini-link:after { background: linear-gradient(127deg, #1C213A 2.9%, #060606 100%); } .gemini-partner-item .gemini-item.gemini-link .gemini-label .gemini-text, .gemini-partner-item .gemini-item.gemini-link .gemini-label .gemini-arrow { transition-property: transform, opacity; transition-duration: 0.15s; will-change: transform, opacity; } .gemini-partner-item .gemini-item.gemini-link .gemini-label .gemini-text { /*transform: translateX(calc(var(--gemini-offset) * -1));*/ } .gemini-partner-item .gemini-item.gemini-link .gemini-label .gemini-arrow { display: block; /*opacity: 0;*/ /*transform: translateX(calc(var(--gemini-offset) * -1));*/ } .gemini-partner-item .gemini-item.gemini-link:hover .gemini-label .gemini-text, .gemini-partner-item .gemini-item.gemini-link:hover .gemini-label .gemini-text, .gemini-partner-item .gemini-item.gemini-link:focus-visible .gemini-label .gemini-text { /*transform: translateX(0);*/ } .gemini-partner-item .gemini-item.gemini-link:hover .gemini-label .gemini-arrow, .gemini-partner-item .gemini-item.gemini-link:focus-visible .gemini-label .gemini-arrow { /*opacity: 1;*/ /*transition-delay: 0.05s;*/ transform: translateX(0); } .gemini-partner-item .gemini-item.gemini-dark { --gemini-glow: rgb(255 255 255 / 0.4); --gemini-hover-alpha: 0.1; background: linear-gradient(135deg, #10121B 0%, #060606 100%); } .gemini-partner-item .gemini-item.gemini-dark::before { background: var(--gemini-color-grey-700); } .gemini-partner-item .gemini-item.gemini-dark .gemini-label { color: var(--gemini-color-grey-100); } .gemini-partner-item .gemini-item.gemini-light { --gemini-glow: rgb(255 255 255 / 0.6); --gemini-hover-alpha: 0.2; background: linear-gradient(113deg, rgba(255, 255, 255, 0.27) -7.22%, rgba(255, 255, 255, 0) 99.63%); } .gemini-partner-item .gemini-item.gemini-light::before { background: rgba(255, 255, 255, 0.1); } .gemini-partner-item .gemini-item.gemini-light .gemini-label { color: var(--gemini-color-white); } .gemini-partner-item .gemini-sparks { container-type: size; position: absolute; inset: 0; pointer-events: none; z-index: 2; mask-image: linear-gradient(transparent, transparent), linear-gradient(white, white); mask-clip: padding-box, border-box; mask-composite: intersect; -webkit-mask-image: linear-gradient(transparent, transparent), linear-gradient(white, white); -webkit-mask-clip: padding-box, border-box; -webkit-mask-composite: source-in, xor; border: calc(var(--gemini-border-width) * 1px) solid transparent; border-radius: calc(var(--gemini-border-radius) * 1px); } .gemini-partner-item .gemini-sparks .gemini-spark { position: absolute; inset: 0; overflow: visible; opacity: 0; transition: opacity 0.15s ease-in-out; } .gemini-partner-item .gemini-sparks .gemini-spark::before { --gemini-spread: 110; --gemini-glow-spread: calc(var(--gemini-spread) * 1deg); content: ""; position: absolute; inset: -100%; background: conic-gradient(from calc(270deg - var(--gemini-glow-spread) * 0.5), var(--gemini-glow) 0, var(--gemini-glow) var(--gemini-glow-spread), transparent var(--gemini-glow-spread)); background-repeat: no-repeat; border-radius: calc(var(--gemini-border-radius) * 1px); opacity: 0; transition: opacity 0.2s ease-in-out; } .gemini-partner-item .gemini-content { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: var(--gemini-space-8); block-size: 100%; inline-size: 100%; z-index: 2; } @media (min-width: 834px) { .gemini-partner-item .content { gap: var(--gemini-space-16); } } .gemini-partner-item .gemini-content img { aspect-ratio: 106/74; inline-size: 100%; max-inline-size: 63%; transition-property: transform; transition-duration: 0.15s; transition-timing-function: ease-in-out; } .gemini-partner-item .gemini-content .gemini-label { --gemini-offset: 0.6em; flex-shrink: 0; flex-direction: column; justify-content: flex-end; text-align: center; display: flex; flex-direction: row; justify-content: center; align-items: center; gap: var(--gemini-offset); } .gemini-partner-item .gemini-content .gemini-label .gemini-arrow { display: none; } @keyframes gemini-item-spin { 0% { rotate: 0deg; opacity: 0; } 50% { opacity: 1; } 100% { opacity: 0; rotate: 560deg; } } /* Gemini: Spark box */ .gemini-spark-box .gemini-spark-box-item { --gemini-_size: var(--gemini-spark-box-item-size, 106px); --gemini-_block-size: var(--gemini-spark-box-item-block-size, var(--gemini-_size)); --gemini-_inline-size: var(--gemini-spark-box-item-inline-size, var(--gemini-_size)); --gemini-border-width: 1; --gemini-border-radius: 8; --gemini-hover-alpha: 0.2; block-size: var(--gemini-_block-size); inline-size: var(--gemini-_inline-size); text-decoration: none; user-select: none; position: relative; border-radius: calc(var(--gemini-border-radius) * 1px); overflow: hidden; } @media (min-width: 834px) { .gemini-spark-box .gemini-spark-box-item { --gemini-_size: var(--gemini-spark-box-item-size, 170px); } } .gemini-spark-box .gemini-spark-box-item::before { content: ""; position: absolute; inset: 0; border: calc(var(--gemini-border-width) * 1px) solid transparent; border-radius: calc(var(--gemini-border-radius) * 1px); -webkit-mask-image: linear-gradient(hsla(0, 0%, 100%, 0), hsla(0, 0%, 100%, 0)), linear-gradient(hsl(0, 0%, 100%), hsl(0, 0%, 100%)); -webkit-mask-clip: padding-box, border-box; -webkit-mask-composite: source-in, xor; mask-image: linear-gradient(hsla(0, 0%, 100%, 0), hsla(0, 0%, 100%, 0)), linear-gradient(hsl(0, 0%, 100%), hsl(0, 0%, 100%)); mask-clip: padding-box, border-box; mask-composite: intersect; z-index: 2; } .gemini-spark-box .gemini-spark-box-item::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to right, rgb(255 255 255/var(--gemini-hover-alpha)), transparent); border: calc(var(--gemini-border-width) * 1px) solid transparent; border-radius: calc(var(--gemini-border-radius) * 1px); z-index: 1; opacity: 0; transition: opacity 0.35s ease-in-out; } .gemini-spark-box .gemini-spark-box-item:hover .gemini-spark, .gemini-spark-box .gemini-spark-box-item:focus-visible .gemini-spark { opacity: 1; } .gemini-spark-box .gemini-spark-box-item:hover .gemini-spark::before, .gemini-spark-box .gemini-spark-box-item:focus-visible .gemini-spark::before { opacity: 1; animation: gemini-spark-box-spin 0.82s linear forwards; } .gemini-spark-box .gemini-spark-box-item:hover::after, .gemini-spark-box .gemini-spark-box-item:focus-visible::after { opacity: 1; } .gemini-spark-box .gemini-spark-box-item.gemini-dark { --gemini-glow: rgb(255 255 255 / 0.4); --gemini-hover-alpha: 0.1; background: linear-gradient(121deg, rgba(255, 255, 255, 0.07) -12.02%, rgba(255, 255, 255, 0.01) 87.55%); } .gemini-spark-box .gemini-spark-box-item.gemini-dark::before { background: var(--gemini-color-grey-700); } .gemini-spark-box-item .gemini-sparks { container-type: size; position: absolute; inset: 0; pointer-events: none; z-index: 2; mask-image: linear-gradient(transparent, transparent), linear-gradient(white, white); mask-clip: padding-box, border-box; mask-composite: intersect; -webkit-mask-image: linear-gradient(transparent, transparent), linear-gradient(white, white); -webkit-mask-clip: padding-box, border-box; -webkit-mask-composite: source-in, xor; border: calc(var(--gemini-border-width) * 1px) solid transparent; border-radius: calc(var(--gemini-border-radius) * 1px); } .gemini-spark-box-item .gemini-sparks .gemini-spark { position: absolute; inset: 0; overflow: visible; opacity: 0; transition: opacity 0.15s ease-in-out; } .gemini-spark-box-item .gemini-sparks .gemini-spark::before { --gemini-spread: 110; --gemini-glow-spread: calc(var(--gemini-spread) * 1deg); content: ""; position: absolute; inset: -100%; background: conic-gradient(from calc(270deg - var(--gemini-glow-spread) * 0.5), var(--gemini-glow) 0, var(--gemini-glow) var(--gemini-glow-spread), transparent var(--gemini-glow-spread)); background-repeat: no-repeat; border-radius: calc(var(--gemini-border-radius) * 1px); opacity: 0; transition: opacity 0.2s ease-in-out; } .gemini-spark-box-item .gemini-content { block-size: 100%; inline-size: 100%; z-index: 2; } @media (min-width: 834px) { .gemini-spark-box .gemini-spark-box-item .content { gap: var(--gemini-space-16); } } @keyframes gemini-spark-box-spin { 0% { rotate: 0deg; opacity: 0; } 50% { opacity: 1; } 100% { opacity: 0; rotate: 560deg; } } /* Sticky Nav */ .gemini-sticky-nav:not(.gemini-no-sticky) { --gemini-nav-bottom-padding: 20px; --gemini-nav-height: 36px; --_gemini-nav-background: var(--gemini-color-grey-700); --_gemini-nav-item-color: var(--gemini-color-grey-400); --_gemini-nav-item-active: var(--gemini-color-grey-600); --_gemini-nav-item-color-hover: var(--gemini-color-white); position: sticky; top: calc(100vh - var(--gemini-nav-height) - var(--gemini-nav-bottom-padding)); padding-bottom: var(--gemini-nav-bottom-padding); left: 0; justify-content: flex-start; z-index: 11; display: none; height: 0; opacity: 0; visibility: hidden; transition: opacity 0.6s 0.3s, visibility 0.6s 0.3s; } @media (min-width: 1024px) { .gemini-sticky-nav:not(.gemini-no-sticky) { display: flex; justify-content: center; --gemini-nav-height: 48px; --gemini-nav-bottom-padding: 32px; } } .gemini-sticky-nav:not(.gemini-no-sticky).gemini-onscreen { opacity: 1; visibility: visible; } .gemini-sticky-nav:not(.gemini-no-sticky) .gemini-nav { display: flex; background-color: var(--gemini-nav-background, var(--_gemini-nav-background)); padding: 6px; border-radius: 56px; max-width: 335px; position: absolute; inset-block-end: 0; inset-inline-start: 0; block-size: var(--gemini-nav-height); } @media (min-width: 834px) { .gemini-sticky-nav:not(.gemini-no-sticky) .gemini-nav { max-width: 100%; position: relative; } } .gemini-sticky-nav:not(.gemini-no-sticky) .gemini-nav__item { padding-inline: 24px; flex-shrink: 0; border-radius: 56px; transition: background-color 0.3s var(--gemini-ease-out-cubic); } .gemini-sticky-nav:not(.gemini-no-sticky) .gemini-nav__item a { text-decoration: none; color: var(--gemini-nav-item-color, var(--_gemini-nav-item-color)); display: inline-flex; align-items: center; justify-content: center; min-height: 36px; transition: color 0.2s var(--gemini-ease-out-cubic); } .gemini-sticky-nav:not(.gemini-no-sticky) .gemini-nav__item a:hover { color: var(--gemini-nav-item-color-hover, var(--_gemini-nav-item-color-hover)); } .gemini-sticky-nav:not(.gemini-no-sticky) .gemini-nav__item.gemini-link--active { background: var(--gemini-nav-item-active-background, var(--_gemini-nav-item-active)); } .gemini-sticky-nav:not(.gemini-no-sticky) .gemini-nav__item.gemini-link--active a { color: var(--gemini-color-white); } .gemini-sticky-nav:not(.gemini-no-sticky).gemini-light-theme { --_gemini-nav-background: var(--gemini-color-white); --_gemini-nav-item-active: linear-gradient(61deg, #64b8fb 6.28%, #217bfe 76.97%); --_gemini-nav-item-color: var(--gemini-color-grey-600); --_gemini-nav-item-color-hover: var(--gemini-color-grey-900); } /** Gemini Section: Details */ .gemini-section-details-element { --gemini-animation-buttons-order: 3; display: block; position: relative; z-index: 4; } .gemini-section-details-element .gemini-section--details { position: relative; } .gemini-section-details-element .gemini-details__header { display: grid; place-items: center; position: relative; } .gemini-section-details-element .gemini-header__inner { --gemini-copy-max-width: 730px; --gemini-heading-max-width: 320px; } @media (min-width: 834px) { .gemini-section-details-element .gemini-header__inner { --gemini-heading-max-width: 550px; } } .gemini-section-details-element .gemini-details__body { text-align: center; position: relative; z-index: 5; } .gemini-section-details-element .gemini-details { grid-column: 1/-1; } @media (min-width: 1024px) { .gemini-section-details-element .gemini-details { grid-column: 2/span 10; } } .gemini-details-rings-container { --gemini-rings-section-offset-y: -28%; } @media (min-width: 600px) { .gemini-details-rings-container { display: block; } } /** Gemini: Module Code */ .gemini-module-code-element { display: block; } .gemini-module-code-element .gemini-module--code { width: 100%; --space: var(--gemini-space-d40); } .gemini-module-code-element .gemini-code__wrapper { transform: scale(1.2); transition: 0.8s var(--gemini-ease-out-quad); } .gemini-module-code-element .gemini-onscreen .gemini-code__wrapper { transform: scale(1); } /** Gemini: Code Preview */ .gemini-code-preview-element article { display: flex; flex-direction: column; gap: var(--gemini-space-40); } @media (min-width: 834px) { .gemini-code-preview-element article { gap: var(--gemini-space-48); } } .gemini-code-preview-element .gemini-window { --gemini-padding-inline: 24px; --gemini-padding-block: 24px; --gemini-border-radius: 16px; --gemini-line-height: 180%; --gemini-gap: 20px; } @media (min-width: 834px) { .gemini-code-preview-element .gemini-window { --gemini-padding-inline: 48px; --gemini-padding-block: 40px; --gemini-border-radius: 24px; --gemini-gap: 40px; } } .gemini-code-preview-element .gemini-tabs { background-color: var(--gemini-color-grey-800); border-radius: var(--gemini-border-radius) var(--gemini-border-radius) 0 0; user-select: none; overflow-x: auto; display: flex; justify-content: space-between; align-items: center; } .gemini-code-preview-element .gemini-tabs__links { display: flex; gap: var(--gemini-gap); padding-inline: var(--gemini-padding-inline); overflow-y: hidden; } .gemini-code-preview-element .gemini-tabs__links button { position: relative !important; all: unset; cursor: pointer; display: grid; padding-block: 16px; white-space: nowrap; } .gemini-code-preview-element .gemini-tabs__links button:focus-visible { outline: 1px solid var(--gemini-color-blue); } .gemini-code-preview-element .gemini-tabs__links button span:nth-child(1) { color: var(--gemini-color-grey-500); } .gemini-code-preview-element .gemini-tabs__links button span:nth-child(2) { background: var(--gemini-color-blue-gradient); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; opacity: 0; transition: opacity 0.2s var(--gemini-ease-in-out); } .gemini-code-preview-element .gemini-tabs__links button:hover span:nth-child(2) { opacity: 1; } .gemini-code-preview-element .gemini-tabs__links button::before { content: ""; display: block; position: absolute; inset-block-end: 0; inset-inline-start: -8px; block-size: 3px; inline-size: calc(100% + 16px); border-radius: 3px 3px 0 0; background: var(--gemini-color-blue-gradient); transition-property: opacity, transform; transition-duration: 0.25s; transition-timing-function: ease-in-out; opacity: 0; transform: translateY(100%); } .gemini-code-preview-element .gemini-tabs__links button.gemini-active::before { opacity: 1; transform: translateY(0); } .gemini-code-preview-element .gemini-tabs__links button.gemini-active span:nth-child(2) { opacity: 1; } .gemini-code-preview-element .gemini-editor { display: grid; grid-template-columns: auto 1fr; background-color: var(--gemini-color-grey-600); border-radius: 0 0 var(--gemini-border-radius) var(--gemini-border-radius); padding-inline: 0 24px; padding-block: var(--gemini-padding-block); font-family: var(--gemini-font-secondary); text-align: start; overflow-x: auto; } .gemini-code-preview-element .gemini-editor__numbers { line-height: var(--gemini-line-height); color: var(--gemini-color-grey-500); user-select: none; } .gemini-code-preview-element pre.gemini-editor__code { background-color: var(--gemini-color-grey-600); tab-size: 1em; margin-inline-start: 0; line-height: var(--gemini-line-height); color: var(--gemini-color-grey-100); } @media (min-width: 1024px) { .gemini-code-preview-element pre.gemini-editor__code { margin-inline-start: 0; } } .gemini-code-preview-element .gemini-highlight { color: var(--gemini-color-blue); } .gemini-code-preview-element .gemini-details-cta { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 12px; } @media (min-width: 738px) { .gemini-code-preview-element .gemini-details-cta { flex-direction: row; } } /* CARD ARROW */ .gemini-card-arrow { display: grid; align-items: stretch; } .gemini-card-arrow .gemini-gradient-CTA__inner { display: grid; } .gemini-card-arrow .gemini-card-inner { display: flex; position: relative; flex-direction: column; } @media screen and (min-width: 834px) { .gemini-card-arrow .gemini-card-inner { row-gap: 0; } } .gemini-card-arrow .gemini-media-wrapper { aspect-ratio: 738/413; inline-size: 100%; background: var(--gemini-color-grey-700); overflow: hidden; border-top-left-radius: 24px; border-top-right-radius: 24px; flex-shrink: 0; } .gemini-card-arrow .gemini-media-wrapper > * { background-size: cover; inline-size: 100%; } .gemini-card-arrow .gemini-text-wrapper { position: relative; padding: 24px; flex: 1; display: flex; row-gap: 16px; flex-direction: column; } @media screen and (min-width: 836px) { .gemini-card-arrow .gemini-text-wrapper { padding: 32px; column-gap: 32px; flex-direction: row; } } .gemini-card-arrow .gemini-icon-wrapper { flex-shrink: 0; } .gemini-card-arrow .gemini-card-copy { display: flex; flex-direction: column; max-inline-size: 234px; } @media screen and (min-width: 836px) { .gemini-card-arrow .gemini-card-copy { max-inline-size: var(--gemini-card-copy-max-width, 382px); } } .gemini-card-arrow .gemini-model-copy { color: var(--gemini-color-grey-400); } .gemini-card-arrow .gemini-arrow-link { position: absolute; inset-inline-end: 16px; inset-block-start: 16px; } @media screen and (min-width: 836px) { .gemini-card-arrow.gemini-layout-compact .gemini-card-inner { flex-direction: row; } } /* BLOG */ .gemini-blog-layout { row-gap: var(--gemini-size-grid-gap); } .gemini-blog-layout > * { grid-column: 1/-1; } @media screen and (min-width: 1024px) { .gemini-blog-layout > *:nth-child(1) { grid-area: 1/1/span 3/span 7; } .gemini-blog-layout > *:nth-child(2) { grid-area: 1/8/span 1/span 5; } .gemini-blog-layout > *:nth-child(3) { grid-area: 2/8/span 1/span 5; } .gemini-blog-layout > *:nth-child(4) { grid-area: 3/8/span 1/span 5; } } .gemini-blog-layout .article > * { block-size: 100%; } .gemini-blog-layout .article:first-of-type { --gemini-card-copy-max-width: 490px; } .gemini-blog-layout .article .gemini-card-arrow .gemini-model-copy { margin-top: auto; } /* CARD WITH BUTTON */ .gemini-card-with-button { display: grid; --_gemini-padding: 32px; } @media screen and (min-width: 834px) { .gemini-card-with-button { --_gemini-padding: 40px; } } .gemini-card-with-button .gemini-card-content { border-radius: var(--gemini-border-radius-d24); color: inherit; display: flex; height: 100%; padding: var(--_gemini-padding); position: relative; text-decoration: none; } .gemini-card-with-button .gemini-card-copy { display: flex; align-items: flex-start; flex-direction: column; gap: 24px; inline-size: 100%; } .gemini-card-with-button .gemini-card-copy .gemini-card-buttons { display: flex; column-gap: 8px; row-gap: 12px; flex-wrap: wrap; } .gemini-card-with-button .gemini-model-copy { color: var(--gemini-color-grey-400); max-inline-size: 420px; } .gemini-card-with-button .gemini-btn.gemini-tertiary { --gemini-button-fill: transparent; --gemini-button-text: var(--gemini-color-white); border: 1px solid var(--gemini-color-grey-600); flex-shrink: 0; inline-size: auto; } @media screen and (min-width: 834px) { .gemini-card-with-button.gemini-layout-large, .gemini-card-with-button.gemini-layout-inside-box { --_gemini-padding: 48px 48px; } .gemini-card-with-button.gemini-layout-large .gemini-card-copy, .gemini-card-with-button.gemini-layout-inside-box .gemini-card-copy { align-items: flex-start; gap: 24px; } .gemini-card-with-button.gemini-layout-large .gemini-card-copy > div:nth-child(1), .gemini-card-with-button.gemini-layout-inside-box .gemini-card-copy > div:nth-child(1) { flex: 1; } .gemini-card-with-button.gemini-layout-large .gemini-model-copy, .gemini-card-with-button.gemini-layout-inside-box .gemini-model-copy { width: 100%; max-inline-size: 610px; } } .gemini-card-with-button.gemini-layout-compact .gemini-card-copy { flex-direction: column; } @media screen and (min-width: 834px) { .gemini-card-with-button.gemini-layout-compact .gemini-card-copy { gap: 32px; } } .gemini-card-with-button.gemini-layout-compact .gemini-btn.gemini-tertiary { margin-block-start: auto; } @media screen and (max-width: 834px) { .gemini-card-with-button.gemini-layout-inside-box { --_gemini-padding: 40px 24px; } } .gemini-card-with-button.gemini-image-direction-column .gemini-card-content { flex-direction: column; row-gap: 40px; } .gemini-card-with-button.gemini-image-direction-column .gemini-card-image { inline-size: 100%; } .gemini-card-with-button.gemini-image-direction-column .gemini-card-image img { inline-size: 100%; } .gemini-card-with-button .gemini-card-image { border-radius: var(--gemini-border-radius-d16); clip-path: fill-box; line-height: 0; } /* Dialog */ .gemini-dialog { background: transparent; block-size: 100%; border: none; color: inherit; inline-size: 100%; max-block-size: none; max-inline-size: none; padding: 0; } .gemini-dialog::backdrop { background: transparent; } .gemini-dialog.gemini-dialog--active .gemini-dialog__backdrop { opacity: 0.8; } .gemini-dialog.gemini-dialog--active .gemini-dialog__content { opacity: 1; } .gemini-dialog__close-button { align-items: center; all: unset; box-sizing: border-box; cursor: pointer; display: flex; justify-content: center; position: absolute; z-index: 10; } .gemini-dialog__backdrop { background: #000; inset: 0; opacity: 0; outline: none; position: absolute; transition: opacity 0.2s ease-out; z-index: 1; } .gemini-dialog__content { opacity: 0; position: relative; transition: opacity 0.4s ease-out; } .gemini-dialog-wysiwyg h3 { margin-block-end: 4px; } .gemini-dialog-wysiwyg h2 { margin-block-end: 4px; } .gemini-dialog-wysiwyg p { color: var(--gemini-color-grey-300); } .gemini-dialog-wysiwyg b { color: var(--gemini-color-grey-200); font-weight: 500; } .gemini-side-dialog { overflow: hidden; } .gemini-side-dialog .gemini-dialog__content { position: absolute; z-index: 5; background: var(--gemini-color-grey-700); max-width: 600px; padding-block: 104px 46px; padding-inline: 20px; overflow-y: scroll; scrollbar-width: thin; scrollbar-color: var(--gemini-color-white) transparent; height: 100%; inset-block-start: 0; inset-inline-end: 0; } @media (min-width: 768px) { .gemini-side-dialog .gemini-dialog__content { padding-block: 140px 24px; padding-inline: 64px; } } .gemini-side-dialog .gemini-dialog__eyebrow { color: var(--gemini-color-grey-400); } .gemini-side-dialog .gemini-dialog__close-button { inset-block-start: 48px; inset-inline-end: 20px; block-size: 48px; inline-size: 48px; border: 1px solid var(--gemini-color-grey-600); border-radius: 50%; background: transparent; transition: background 0.3s linear; } @media (min-width: 834px) { .gemini-side-dialog .gemini-dialog__close-button { inset-inline-end: 64px; } } .gemini-side-dialog .gemini-dialog__close-button svg { max-inline-size: 14px; } .gemini-side-dialog .gemini-dialog__close-button:hover, .gemini-side-dialog .gemini-dialog__close-button:focus-visible { background: var(--gemini-color-grey-600); } .gemini-side-dialog .gemini-dialog__close-button:focus-visible { outline: 1px solid var(--gemini-color-white); } .gemini-modal-dialog .gemini-dialog__close-button { block-size: 24px; inline-size: 24px; inset-block-start: 20px; inset-inline-end: 20px; transition: opacity 0.2s linear; background: transparent; } @media (min-width: 834px) { .gemini-modal-dialog .gemini-dialog__close-button { inset-block-start: 24px; inset-inline-end: 24px; } } .gemini-modal-dialog .gemini-dialog__close-button:hover { opacity: 0.7; } .gemini-modal-dialog .gemini-dialog__close-button:focus-visible { outline: 1px solid var(--gemini-color-white); } .gemini-modal-dialog .gemini-dialog-inner { align-items: center; block-size: 100%; display: flex; inline-size: 100%; justify-content: center; pointer-events: none; position: relative; z-index: 10; } @media (min-width: 834px) { .gemini-modal-dialog .gemini-dialog-inner { padding-block: 24px; } } .gemini-modal-dialog .gemini-dialog__content { background: var(--gemini-color-grey-700); block-size: var(--gemini-dialog-height, 100%); display: flex; flex-direction: column; inline-size: 100%; margin: auto auto; max-block-size: 100%; max-inline-size: var(--gemini-dialog-max-width, 846px); padding-block: 32px 20px; padding-inline: 20px; pointer-events: all; border: 1px solid var(--gemini-color-grey-600); } @media (min-width: 834px) { .gemini-modal-dialog .gemini-dialog__content { max-block-size: var(--gemini-dialog-max-height, 620px); border-radius: 24px; padding-block: 48px; padding-inline: 40px; } } .gemini-modal-dialog .gemini-dialog-header { flex-shrink: 0; margin-inline: auto; max-inline-size: 420px; text-align: center; } .gemini-modal-dialog .gemini-dialog-body { flex-grow: 1; overflow: hidden; padding-inline: 0 0; } .gemini-modal-dialog .gemini-dialog-block { background: var(--gemini-color-grey-800); border-radius: 12px; border: 1px solid var(--gemini-color-grey-600); } .gemini-modal-dialog .gemini-dialog-actions { display: flex; align-items: center; gap: 12px; } .gemini-scroller { height: 100%; overflow: auto; padding-block: 32px; padding-inline: 24px 40px; scrollbar-color: var(--gemini-color-white) transparent; scrollbar-width: thin; } .gemini-video-dialog .gemini-dialog-inner { align-items: center; block-size: 100%; display: flex; inline-size: 100%; justify-content: center; position: relative; z-index: 10; padding-inline: 20px; } @media screen and (min-width: 834px) { .gemini-video-dialog .gemini-dialog-inner { padding-inline: 60px; } } .gemini-video-dialog .gemini-dialog__close-button { position: absolute; background: var(--gemini-color-white); block-size: 40px; inline-size: 40px; inset-block-start: -60px; inset-inline-end: 0; border-radius: 50%; } @media screen and (min-width: 834px) { .gemini-video-dialog .gemini-dialog__close-button { inset-block-start: -40px; inset-inline-end: -40px; } } .gemini-video-dialog .gemini-dialog__close-button svg { width: 24px; } .gemini-video-dialog .gemini-dialog__content { inline-size: 100%; aspect-ratio: 559/315; position: relative; } @media screen and (min-width: 834px) { .gemini-video-dialog .gemini-dialog__content { min-inline-size: 700px; max-inline-size: 1200px; inline-size: 80%; } } .gemini-video-dialog .gemini-dialog__content .gemini-dialog-body { block-size: 100%; line-height: 0; border: var(--gemini-color-grey-600) 1px solid; border-radius: 16px; overflow: hidden; background: var(--gemini-color-grey-600); } .gemini-dialog-link { all: unset; cursor: pointer; color: var(--gemini-dialog-link-cta, #368efe); } </style><style> /* Styles inlined from /css/winners.css */ body.gemini-winners { height: 100%; overflow: hidden; } body.gemini-winners .devsite-footer { position: fixed; bottom: 0; left: 0; width: 100%; transform: translateY(100%); transition: transform .2s ease-out; } body.gemini-winners.gemini-end .devsite-footer { transform: translateY(0); } [layout="full"] .devsite-main-content { padding-top: 0; } .gemini-winners-page { --gemini-selector-index: 0; height: calc(100dvh - var(--devsite-js-header-height)); } .gemini-winners-page .gemini-snap-scroll-container { overflow-y: scroll; overflow-x: hidden; height: 100%; scroll-snap-type: y mandatory; } .gemini-winners-page .gemini-snap-scroll-container.no-snap { scroll-snap-type: none; } .gemini-winners-page .gemini-winners-gradient-background { position: fixed; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; pointer-events: none; background-image: url("/images/winners/1600_black.jpg"); background-size: cover; background-position: center bottom -20vh; background-repeat: no-repeat; mix-blend-mode: screen; will-change: opacity; opacity: 0; transform: translateY(50%); transition: all 1s; } .gemini-winners-page .gemini-winners-gradient-background.gemini-onscreen { opacity: 1; transform: translateY(0); } .gemini-winners-page .gemini-centered-title { max-width: 520px; margin: 0 auto; text-align: center; padding-bottom: 100px; } .gemini-black-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: var(--gemini-color-black); pointer-events: none; z-index: 5; will-change: opacity; transition: opacity 1s ease-out .2s; } .gemini-black-overlay.gemini-onscreen { opacity: 0; } .gemini-snap-scroll-item-start { scroll-snap-align: start; } .gemini-snap-scroll-item-center { scroll-snap-align: center; } .gemini-winners-gradient-text { background: var(--gemini-color-blue-gradient); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .gemini-winners-scroll-cta-wrapper { opacity: 0; animation: transitionIn 0.7s var(--gemini-ease-in-out-quad) forwards 1.8s; } .gemini-underline-cta:after { transition: width cubic-bezier(0.66, 0.02, 0.06, 0.97) 0.5s; background: #fff; content: ""; display: block; height: 1px; width: 0; } .gemini-underline-cta:hover:after { width: 100%; } .gemini-down-arrow-cta { position: absolute; bottom: 32px; right: 40px; z-index: 1; cursor: pointer; background-image: url('data:image/svg+xml,%3Csvg width="15" height="15" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath d="m5.416 8.125 2.708 2.708m0 0 2.709-2.708m-2.709 2.708v-6.5a2.167 2.167 0 0 0-2.166-2.166H2.166" stroke="%23fff" stroke-width="1.417" stroke-linecap="round" stroke-linejoin="round"/%3E%3C/svg%3E'); display: inline-block; background-size: contain; background-repeat: no-repeat; background-color: transparent; padding: 0 0 0 20px; border: 0; text-decoration: none; color: var(--gemini-color-white); display: none; } .gemini-down-arrow-cta:focus, .gemini-down-arrow-cta:active, .gemini-down-arrow-cta:visited { text-decoration: none; } @media (min-width: 834px) { .gemini-down-arrow-cta { display: block; } } .gemini-toggle-winners-vis, .gemini-toggle-intro-vis { opacity: 0; transition: opacity .2s; pointer-events: none; } .gemini-toggle-winners-vis.active, .gemini-toggle-intro-vis.active { opacity: 1; pointer-events: auto; } .gemini-floating-ui-container { position: fixed; top: 0; left: 50%; transform: translateX(-50%); max-width: 1680px; width: 100%; height: 100dvh; z-index: 2; pointer-events: none; } .gemini-winner-categories { position: fixed; right: 40px; z-index: 2; top: calc(50vh + var(--devsite-js-header-height, 0px) / 2); max-width: 250px; transform: translateY(-50%); display: none; } @media (min-width: 1140px) { .gemini-winner-categories { display: block; } } .gemini-winner-categories .gemini-winner-categories-title { pointer-events: none; margin-bottom: 16px; } .gemini-winner-categories .gemini-winner-categories-list a { color: #51596d; text-decoration: none; } .gemini-winner-categories .gemini-winner-categories-list a span:nth-child(2) { opacity: 0; transition: 0.6s opacity cubic-bezier(0, 0.03, 0.12, 0.99); } .gemini-winner-categories .gemini-winner-categories-list .gemini-link--active a span:nth-child(2), .gemini-winner-categories .gemini-winner-categories-list a:hover span:nth-child(2) { opacity: 1; transition: 0s opacity; } .gemini-winner-categories .gemini-spark-bullet { position: absolute; left: -46px; top: 23px; transition: 0.25s transform linear; transform-origin: center; transform: translateY(calc(25.5px * var(--gemini-selector-index))) rotate(calc(90deg * var(--gemini-selector-index))); } .gemini-winner-categories .gemini-spark-bullet svg { display: block; } .gemini-winner-details { position: absolute; left: 50px; top: calc(50vh + var(--devsite-js-header-height, 0px) / 2); z-index: 2; max-width: 270px; transform: translateY(-50%); display: none; pointer-events: none; } @media (min-width: 1140px) { .gemini-winner-details { display: block; } } .gemini-winner-details .gemini-total { color: var(--gemini-color-grey-300); } .gemini-winner-details .gemini-winner-details-counter { position: absolute; top: calc(50% + 50vh - 72px); } .gemini-winner-details .gemini-winner-details-titles-mask { position: relative; overflow: hidden; margin-bottom: 15px; } .gemini-winner-details .gemini-winner-details-titles-mask, .gemini-winner-details .gemini-winner-details-titles li { height: 41px; } .gemini-winner-details .gemini-winner-details-titles { position: absolute; top: calc(-100% * var(--gemini-selector-index)); left: 0; will-change: top; transition: 0.3s top var(--gemini-ease-out-cubic); } .gemini-winner-details .gemini-winner-details-titles li { white-space: nowrap; } .gemini-winner-details .gemini-winner-details-descriptions { display: grid; margin-bottom: 32px; color: var(--gemini-color-grey-300); } .gemini-winner-details .gemini-winner-details-descriptions .gemini-winner-details-description { grid-area: 1/1; opacity: 0; transition: 0.35s opacity; } .gemini-winner-details .gemini-winner-details-descriptions .gemini-winner-details-description.active { opacity: 1; } .gemini-winner-details .gemini-winner-details-cta { display: none; pointer-events: auto; border-radius: 12px; } .gemini-winner-details .gemini-winner-details-cta.active { display: inline-block; } .gemini-winner-intro-body { padding: 0 20px; color: var(--gemini-color-grey-300); } .gemini-title-intro-contents { padding-top: 200px; } .gemini-winners-spacer { height: 50vh; width: 100vw; } .gemini-winner-entry { pointer-events: none; padding: 40px 0; text-align: center; outline: none; } .gemini-winner-entry.active { pointer-events: auto; } .gemini-winner-entry.active .gemini-winner-entry-img { padding: 2px; } .gemini-winner-entry.active .gemini-winner-entry-button { transform: scale(1); opacity: 1; } .gemini-winner-entry.active .gemini-gradient-overlay { animation-play-state: running; } .gemini-winner-entry.active .gemini-winner-info { opacity: 1; } .gemini-winner-entry .gemini-winner-info { opacity: 0; transition: 0.35s opacity; } @media (min-width: 1140px) { .gemini-winner-entry .gemini-winner-info { display: none; } } .gemini-winner-entry .gemini-entry-description { max-width: 430px; margin: 15px auto 0 auto; width: 80%; } .gemini-winner-entry .gemini-entry-gradient-bg { position: absolute; top: 0; left: 0; z-index: -1; width: 100%; height: 100%; background: linear-gradient(var(--angle), rgb(179 196 247) 0%, #217bfe 100%); border-radius: 15px; box-shadow: 0 0 90px #3b6bff8c; } .gemini-winner-entry .gemini-winner-entry-img-container { border-radius: 15px; overflow: hidden; box-shadow: 8px 0 15px 0 rgba(79, 171, 255, 0.35) inset; } .gemini-winner-entry .gemini-winner-entry-img { position: relative; z-index: -1; display: block; padding: 0; border-radius: 15px; } .gemini-winner-entry .gemini-winner-entry-button { display: inline-block; max-width: 570px; margin: 0 20px; box-shadow: 0 0 0 0 transparent; transition: 1s transform var(--gemini-ease-out-expo), 1s opacity var(--gemini-ease-out-expo); transform: scale(0.75); opacity: 0.2; will-change: opacity, box-shadow, transform; } @media (min-width: 1600px) { .gemini-winner-entry .gemini-winner-entry-button { max-width: 640px; } } @media (min-width: 1900px) { .gemini-winner-entry .gemini-winner-entry-button { max-width: 720px; } } .gemini-winner-entry .gemini-winner-entry-button:hover { transform: scale(0.97); } .gemini-winner-entry .gemini-winner-entry-button:hover .gemini-winner-entry-arrow-button { background-color: var(--gemini-color-white); opacity: 1; } .gemini-winner-entry .gemini-winner-entry-button:hover .gemini-winner-entry-arrow-button svg path { fill: #161823; } .gemini-winner-entry .gemini-gradient-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; animation: spin 5.5s linear infinite; animation-play-state: paused; background: linear-gradient(var(--angle),rgba(100,184,251,0) 70%,rgb(135,201,255) 100%); z-index: 1; mask: url(/images/winners/image-mask-inner14.png); mask-size: contain; mix-blend-mode: plus-lighter; transform: scale(1.095); } .gemini-winner-entry .gemini-winner-entry-arrow-button { position: absolute; right: 10px; bottom: 10px; transition: .5s background-color var(--gemini-ease-out-expo); will-change: opacity; background-color: #161823; width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; border-radius: 6px; } .gemini-winner-entry .gemini-winner-entry-arrow-button svg path { transition: .5s fill var(--gemini-ease-out-expo); fill: #fff; } @property --angle { syntax: "<angle>"; inherits: false; initial-value: 0deg; } @keyframes spin { from { --angle: 0deg; } to { --angle: 360deg; } } .gemini-section-intro { background-image: url("/images/winners/top-gradient_black.jpg"); background-size: 100% 100%; background-position: center top; background-repeat: no-repeat; mix-blend-mode: screen; padding-top: 40px; } .gemini-section-intro, .gemini-section-congrats { height: 100%; min-height: 640px; } .gemini-section-congrats { min-height: 640px; } .gemini-spark { width: 120px; } @media (min-width: 834px) { .gemini-spark { width: 172px; } } .gemini-intro-text-block { text-align-last: center; } .gemini-intro-title, .gemini-intro-subtitle { opacity: 0; will-change: opacity; transition: 1.2s opacity var(--gemini-ease-in-out-cubic); } .devsite-article .gemini-page h1.gemini-intro-title { margin-top: -25px; color: inherit; } .gemini-spark, .gemini-intro-text-block, .gemini-delorean-video { transform: translateY(150px) scale(0.8); opacity: 0; will-change: transform, opacity; transition: 1.5s all var(--gemini-ease-in-out-cubic); } .gemini-intro-subtitle { color: var(--gemini-color-grey-200); margin-bottom: 8px; transition-delay: 0.4s; } .gemini-delorean-video { width: 90%; max-width: 656px; margin-bottom: 100px; aspect-ratio: 1.77; } @media (min-width: 834px) { .gemini-delorean-video { margin-bottom: 0; } } .gemini-section-intro.gemini-onscreen .gemini-spark, .gemini-section-intro.gemini-onscreen .gemini-intro-text-block, .gemini-section-intro.gemini-onscreen .gemini-delorean-video { transform: translateY(0) scale(1); opacity: 1; } .gemini-section-intro.gemini-onscreen .gemini-intro-title, .gemini-section-intro.gemini-onscreen .gemini-intro-subtitle { opacity: 1; } .gemini-section-intro-contents, .gemini-section-congrats-contents { display: flex; width: 100vw; height: 100%; justify-content: center; align-items: center; flex-direction: column; } .gemini-section-congrats-contents { opacity: 0; } .gemini-section-congrats.gemini-onscreen .gemini-section-congrats-contents { will-change: transform, opacity; animation: congratsTransitionIn 1.2s var(--gemini-ease-out-cubic) forwards; } .gemini-section-congrats.gemini-onscreen .gemini-congrats-body { animation: introFadeIn 1.2s var(--gemini-ease-out-cubic) forwards .4s; will-change: opacity; } .gemini-congrats-text { max-width: 615px; margin-top: 30px; text-align: center; } .gemini-congrats-body { position: absolute; bottom: 40px; left: 50%; transform: translateX(-50%); max-width: 600px; width: 90%; text-align: center; opacity: 0; color: var(--gemini-color-grey-300); } @keyframes introFadeIn { from { opacity: 0; } to { opacity: 1; } } @keyframes congratsTransitionIn { from { transform: translateY(70px); opacity: 0; } to { transform: translateY(0); opacity: 1; } } .gemini-section-mentions { min-height: calc(100dvh - 50px); width: 100%; display: flex; align-items: center; flex-direction: column; padding-top: calc(50vh + 100px); scroll-margin-top: -50vh; } .gemini-mentions-list { width: 100%; margin-bottom: 200px; } @media (max-width: 834px) { .gemini-mentions-list { --gemini-size-grid-margin: 0; } } .gemini-mentions-list-item { display: grid; grid-template-columns: auto 50px; column-gap: 40px; margin-bottom: 0; padding: 20px; border-bottom: 1px solid var(--gemini-color-grey-600); text-decoration: none; color: var(--gemini-color-white); background-color: transparent; transition: background-color ease-in-out 0.2s; } @media (min-width: 834px) { .gemini-mentions-list-item { display: flex; gap: 40px; padding: 10px 20px 10px 20px; align-items: center; } } .gemini-mentions-list-item:first-child { border-top: 1px solid var(--gemini-color-grey-600); } .gemini-mentions-list-item:hover { background-color: var(--gemini-color-grey-800); } .gemini-mentions-list-item:hover .gemini-item-title-inner { transform: translateX(25px); } .gemini-mentions-list-item:hover .gemini-item-cta:after { width: 100%; } .gemini-mentions-list-item:hover .gemini-item-thumb { transform: scale(0.95); } .gemini-title-arrow { margin-left: -25px; margin-right: 5px; } .gemini-item-thumb { display: block; width: 55px; transition: transform ease-in-out 0.2s; border-radius: 3px; overflow: hidden; grid-row: 1/3; grid-column: 2; } @media (min-width: 834px) { .gemini-item-thumb { width: 75px; } } .gemini-item-title-inner { transition: transform ease-in-out 0.2s; } .gemini-item-title { overflow: hidden; } @media (min-width: 834px) { .gemini-item-title { width: 15%; } } .gemini-item-description { color: var(--gemini-color-grey-200); } .gemini-item-title, .gemini-item-description { flex-grow: 1; } .gemini-item-cta { display: none; } @media (min-width: 834px) { .gemini-item-cta { display: block; } } .gemini-section-end { --gemini-text-gradient: linear-gradient(90deg, #217BFE 0%, #078EFB 33.53%, #AC87EB 67.74%, #EE4D5D 100%); background-color: transparent; height: 100%; width: 100%; padding-bottom: 84px; pointer-events: none; } .gemini-section-end-contents { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; height: 100%; pointer-events: auto; } .gemini-end-text { max-width: 863px; text-align: center; } .gemini-video-cta { position: absolute; left: 20px; bottom: 20px; z-index: 10; opacity: 0; transition: 0.3s opacity var(--gemini-ease-in-out-quad), 0.3s transform var(--gemini-ease-in-out-quad); pointer-events: none; } @media (min-width: 834px) { .gemini-video-cta { left: 40px; bottom: 32px; } } .gemini-video-cta.active { opacity: 1; transform: translateY(0px); pointer-events: auto; } .gemini-video-flex { display: flex; flex-direction: row; align-items: center; gap: 12px; opacity: 0; animation: transitionIn 0.7s var(--gemini-ease-in-out-quad) forwards 1.8s; } @media (min-width: 834px) { .gemini-video-flex { align-items: flex-start; flex-direction: column; } } .gemini-video-button { --devsite-button-background-hover: transparent; --devsite-button-border-hover: transparent; padding: 0; border: none; width: 105px; height: auto; flex: 1; background: transparent; cursor: pointer; overflow: visible; } .gemini-video-cta:hover { border: 0; background-color: inherit; } @media (min-width: 834px) { .gemini-video-button { width: 172px; } } .gemini-video-button:hover .gemini-video-img-container { box-shadow: 0 0 20px 0 #3b6bff61; transform: scale(1.05); } .gemini-video-button .gemini-video-img-container { position: relative; border-radius: 8px; overflow: hidden; padding: 1px; background: linear-gradient(152deg, #64B8FB -17.89%, #3b4e7e 48.1%, #64B8FB 122.52%); box-shadow: 0 0 10px #3b6bff75; transition: .35s all cubic-bezier(0, 0, 0.08, 1.02); } .gemini-video-button .gemini-video-img-container::after { content: ""; display: block; position: absolute; top: 0; left: 0; inset: 0; } .gemini-video-button img { display: block; border-radius: 8px; overflow: hidden; } @keyframes transitionIn { from { opacity: 0; } to { opacity: 1; } } </style> <div class="devsite-article-meta nocontent" role="navigation"> <ul class="devsite-breadcrumb-list" aria-label="Breadcrumb"> <li class="devsite-breadcrumb-item "> <a href="https://ai.google.dev/" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="1" track-type="globalNav" track-name="breadcrumb" track-metadata-position="1" track-metadata-eventdetail="" > Home </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://ai.google.dev/competition" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="2" track-type="globalNav" track-name="breadcrumb" track-metadata-position="2" track-metadata-eventdetail="Gemini API Developer Competition" > Gemini API Developer Competition </a> </li> </ul> </div> <devsite-feedback position="header" project-name="Gemini API Developer Competition" product-id="5292923" bucket="documentation" context="" version="t-devsite-webserver-20241114-r00-rc02.464921008191574316" data-label="Send Feedback Button" track-type="feedback" track-name="sendFeedbackLink" track-metadata-position="header" class="nocontent" project-icon="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/googledevai/images/touchicon-180-new.png" > <button> Send feedback </button> </devsite-feedback> <devsite-feature-tooltip ack-key="AckCollectionsBookmarkTooltipDismiss" analytics-category="Site-Wide Custom Events" analytics-action-show="Callout Profile displayed" analytics-action-close="Callout Profile dismissed" analytics-label="Create Collection Callout" class="devsite-page-bookmark-tooltip nocontent" dismiss-button="true" id="devsite-collections-dropdown" dismiss-button-text="Dismiss" close-button-text="Got it"> <devsite-bookmark></devsite-bookmark> <span slot="popout-heading"> Stay organized with collections </span> <span slot="popout-contents"> Save and categorize content based on your preferences. </span> </devsite-feature-tooltip> <devsite-toc class="devsite-nav" depth="2" devsite-toc-embedded disabled> </devsite-toc> <div class="devsite-article-body clearfix devsite-no-page-title"> <devsite-gemini-winners-page class="gemini-page gemini-winners-page"> <div class="gemini-snap-scroll-container"> <div class="gemini-snap-scroll-item-start gemini-snap-scroll-item gemini-section-intro" data-viewport="in-out" data-section-name="intro"> <div class="gemini-section-intro-contents" data-viewport="once"> <div class="gemini-spark"> <svg viewBox="0 0 120 120" fill="none" xmlns="http://www.w3.org/2000/svg"><g opacity=".6" filter="url(#filter0_f_31375_8921)"><path d="M87.656 59.89c-3.808 0-7.326-.72-10.674-2.142-3.35-1.468-6.305-3.47-8.782-5.947-2.478-2.478-4.48-5.433-5.947-8.782-1.423-3.35-2.144-6.868-2.144-10.677a.11.11 0 1 0-.218 0c0 3.808-.745 7.327-2.213 10.677-1.422 3.35-3.4 6.304-5.877 8.782-2.477 2.477-5.433 4.478-8.782 5.946-3.349 1.423-6.868 2.144-10.677 2.144a.11.11 0 1 0 0 .219c3.808 0 7.327.744 10.677 2.213 3.35 1.423 6.305 3.4 8.782 5.877 2.477 2.478 4.455 5.433 5.878 8.783 1.467 3.349 2.212 6.866 2.212 10.674a.11.11 0 1 0 .218 0c0-3.81.721-7.326 2.143-10.674 1.469-3.35 3.47-6.305 5.947-8.783 2.477-2.477 5.432-4.455 8.783-5.878 3.349-1.468 6.867-2.212 10.674-2.212a.11.11 0 1 0 0-.22Z" fill="url(#paint0_linear_31375_8921)"/></g><path d="M87.656 59.89c-3.808 0-7.326-.72-10.674-2.142-3.35-1.468-6.305-3.47-8.782-5.947-2.478-2.478-4.48-5.433-5.947-8.782-1.423-3.35-2.144-6.868-2.144-10.677a.11.11 0 1 0-.218 0c0 3.808-.745 7.327-2.213 10.677-1.422 3.35-3.4 6.304-5.877 8.782-2.477 2.477-5.433 4.478-8.782 5.946-3.349 1.423-6.868 2.144-10.677 2.144a.11.11 0 1 0 0 .219c3.808 0 7.327.744 10.677 2.213 3.35 1.423 6.305 3.4 8.782 5.877 2.477 2.478 4.455 5.433 5.878 8.783 1.467 3.349 2.212 6.866 2.212 10.674a.11.11 0 1 0 .218 0c0-3.81.721-7.326 2.143-10.674 1.469-3.35 3.47-6.305 5.947-8.783 2.477-2.477 5.432-4.455 8.783-5.878 3.349-1.468 6.867-2.212 10.674-2.212a.11.11 0 1 0 0-.22Z" fill="url(#paint1_linear_31375_8921)"/><g style="mix-blend-mode:plus-lighter" opacity=".6" filter="url(#filter1_f_31375_8921)"><path d="M87.656 59.89c-3.808 0-7.326-.72-10.674-2.142-3.35-1.468-6.305-3.47-8.782-5.947-2.478-2.478-4.48-5.433-5.947-8.782-1.423-3.35-2.144-6.868-2.144-10.677a.11.11 0 1 0-.218 0c0 3.808-.745 7.327-2.213 10.677-1.422 3.35-3.4 6.304-5.877 8.782-2.477 2.477-5.433 4.478-8.782 5.946-3.349 1.423-6.868 2.144-10.677 2.144a.11.11 0 1 0 0 .219c3.808 0 7.327.744 10.677 2.213 3.35 1.423 6.305 3.4 8.782 5.877 2.477 2.478 4.455 5.433 5.878 8.783 1.467 3.349 2.212 6.866 2.212 10.674a.11.11 0 1 0 .218 0c0-3.81.721-7.326 2.143-10.674 1.469-3.35 3.47-6.305 5.947-8.783 2.477-2.477 5.432-4.455 8.783-5.878 3.349-1.468 6.867-2.212 10.674-2.212a.11.11 0 1 0 0-.22Z" fill="url(#paint2_linear_31375_8921)"/></g><defs><linearGradient id="paint0_linear_31375_8921" x1="49.516" y1="68.129" x2="74.637" y2="46.949" gradientUnits="userSpaceOnUse"><stop stop-color="#217BFE"/><stop offset=".27" stop-color="#078EFB"/><stop offset=".777" stop-color="#A190FF"/><stop offset="1" stop-color="#BD99FE"/></linearGradient><linearGradient id="paint1_linear_31375_8921" x1="49.516" y1="68.129" x2="74.637" y2="46.949" gradientUnits="userSpaceOnUse"><stop stop-color="#217BFE"/><stop offset=".27" stop-color="#078EFB"/><stop offset=".777" stop-color="#A190FF"/><stop offset="1" stop-color="#BD99FE"/></linearGradient><linearGradient id="paint2_linear_31375_8921" x1="49.516" y1="68.129" x2="74.637" y2="46.949" gradientUnits="userSpaceOnUse"><stop stop-color="#217BFE" stop-opacity="0"/><stop offset=".27" stop-color="#078EFB" stop-opacity="0"/><stop offset=".777" stop-color="#A190FF"/><stop offset="1" stop-color="#BD99FE"/></linearGradient><filter id="filter0_f_31375_8921" x=".89" y=".89" width="118.218" height="118.218" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur stdDeviation="15.671" result="effect1_foregroundBlur_31375_8921"/></filter><filter id="filter1_f_31375_8921" x="22.49" y="22.49" width="75.019" height="75.019" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur stdDeviation="4.871" result="effect1_foregroundBlur_31375_8921"/></filter></defs></svg> </div> <div class="gemini-intro-text-block"> <h1 class="gemini-intro-title gemini-type-d1 gemini-space-d16" id="gemini-api" data-text="Gemini API" tabindex="-1">Gemini API</h1> <p class="gemini-type-h2 gemini-intro-subtitle">Developer Competition</p> </div> <div class="gemini-delorean-video"> <video autoplay loop muted playsinline> <source src="/static/videos/dolorean.mp4" type='video/mp4' /> <source src="/static/videos/dolorean.webm" type="video/webm"> </video> </div> </div> </div> <div class="gemini-snap-scroll-item-start gemini-snap-scroll-item gemini-section-congrats" data-viewport="in" data-section-name="congrats"> <div class="gemini-section-congrats-contents"> <svg class="gemini-total-svg" width="87" height="133" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M24.93 124.265 56.75 79.68l-.37-.37c-4.317 2.96-9.805 4.44-16.465 4.44-6.413 0-12.703-1.788-18.87-5.365C14.878 74.808 9.883 69.937 6.06 63.77 2.237 57.48.325 50.512.325 42.865c0-7.4 1.912-14.307 5.735-20.72 3.947-6.537 9.188-11.778 15.725-15.725C28.445 2.473 35.66.5 43.43.5c8.387 0 15.848 2.035 22.385 6.105 6.66 4.07 11.778 9.373 15.355 15.91 3.7 6.413 5.55 13.197 5.55 20.35 0 6.783-1.418 13.32-4.255 19.61-2.713 6.167-6.66 13.073-11.84 20.72L37.51 132.96l-12.58-8.695Zm18.5-54.575c4.933 0 9.497-1.172 13.69-3.515 4.317-2.467 7.708-5.735 10.175-9.805 2.467-4.193 3.7-8.757 3.7-13.69 0-5.057-1.233-9.62-3.7-13.69-2.467-4.193-5.858-7.462-10.175-9.805-4.193-2.467-8.757-3.7-13.69-3.7s-9.497 1.233-13.69 3.7c-4.193 2.343-7.523 5.612-9.99 9.805-2.467 4.07-3.7 8.633-3.7 13.69 0 4.933 1.233 9.497 3.7 13.69 2.467 4.07 5.797 7.338 9.99 9.805 4.193 2.343 8.757 3.515 13.69 3.515Z" fill="url(#a)"/><defs><linearGradient id="a" x1="-43.953" y1="21.186" x2="107.38" y2="124.929" gradientUnits="userSpaceOnUse"><stop stop-color="#217BFE"/><stop offset=".27" stop-color="#078EFB"/><stop offset=".777" stop-color="#A190FF"/><stop offset="1" stop-color="#BD99FE"/></linearGradient></defs></svg> <h2 class="gemini-type-h1 gemini-congrats-text" id="winners-across-all-categories.-congratulations-to-everyone" data-text="Winners across all categories. Congratulations to everyone!" tabindex="-1">Winners across all categories. Congratulations to everyone!</h2> <p class="gemini-congrats-body gemini-type-b1">From May 15, 2024 to August 12, 2024, developers were challenged to create apps with the Gemini API for a chance to win a custom electric 1981 DeLorean and more!</p> </div> </div> <div class="gemini-winners-spacer"></div> <div id="w-0" class="gemini-snap-scroll-item-center gemini-snap-scroll-item gemini-winner-entry" data-viewport="in-out" data-section-scroll-position="center" data-section-name="w-0"> <p class="gemini-type-b1 gemini-space-d8 gemini-winners-gradient-text gemini-winner-info">Best overall app</p> <p class="gemini-type-h3 gemini-space-d16 gemini-winner-info">Jayu</p> <a href="/competition/projects/jayu" class="gemini-winner-entry-button" data-category="content_click" data-label="/competition/projects/jayu/" data-action="jayu"> <div class="gemini-entry-gradient-bg"></div> <div class="gemini-winner-entry-img-container"> <img class="gemini-winner-entry-img" src="/static/images/winners/jayu.jpg" alt="jayu"> </div> <div class="gemini-gradient-overlay"></div> <div class="gemini-winner-entry-arrow-button"> <svg class="arrow" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M9.33366 4L8.39366 4.94L10.7803 7.33333H2.66699L2.66699 8.66667H10.7803L8.39366 11.06L9.33366 12L13.3337 8L9.33366 4Z" fill="#161823"/> </svg> </div> </a> <p class="gemini-type-b2 gemini-winner-info gemini-entry-description">A personal assistant that seamlessly integrates the Gemini API with a user's device</p> </div> <div id="w-1" class="gemini-snap-scroll-item-center gemini-snap-scroll-item gemini-winner-entry" data-viewport="in-out" data-section-scroll-position="center" data-section-name="w-1"> <p class="gemini-type-b1 gemini-space-d8 gemini-winners-gradient-text gemini-winner-info">Most impactful app</p> <p class="gemini-type-h3 gemini-space-d16 gemini-winner-info">VITE VERE</p> <a href="/competition/projects/vite-vere" class="gemini-winner-entry-button" data-category="content_click" data-label="/competition/projects/vite-vere/" data-action="VITE VERE"> <div class="gemini-entry-gradient-bg"></div> <div class="gemini-winner-entry-img-container"> <img class="gemini-winner-entry-img" src="/static/images/winners/vite-vere.jpg" alt="VITE VERE"> </div> <div class="gemini-gradient-overlay"></div> <div class="gemini-winner-entry-arrow-button"> <svg class="arrow" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M9.33366 4L8.39366 4.94L10.7803 7.33333H2.66699L2.66699 8.66667H10.7803L8.39366 11.06L9.33366 12L13.3337 8L9.33366 4Z" fill="#161823"/> </svg> </div> </a> <p class="gemini-type-b2 gemini-winner-info gemini-entry-description">Personalized support to people with cognitive disabilities, promoting autonomy in daily life</p> </div> <div id="w-2" class="gemini-snap-scroll-item-center gemini-snap-scroll-item gemini-winner-entry" data-viewport="in-out" data-section-scroll-position="center" data-section-name="w-2"> <p class="gemini-type-b1 gemini-space-d8 gemini-winners-gradient-text gemini-winner-info">Most useful app</p> <p class="gemini-type-h3 gemini-space-d16 gemini-winner-info">Prospera</p> <a href="/competition/projects/prospera" class="gemini-winner-entry-button" data-category="content_click" data-label="/competition/projects/prospera/" data-action="Prospera"> <div class="gemini-entry-gradient-bg"></div> <div class="gemini-winner-entry-img-container"> <img class="gemini-winner-entry-img" src="/static/images/winners/prospera.jpg" alt="Prospera"> </div> <div class="gemini-gradient-overlay"></div> <div class="gemini-winner-entry-arrow-button"> <svg class="arrow" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M9.33366 4L8.39366 4.94L10.7803 7.33333H2.66699L2.66699 8.66667H10.7803L8.39366 11.06L9.33366 12L13.3337 8L9.33366 4Z" fill="#161823"/> </svg> </div> </a> <p class="gemini-type-b2 gemini-winner-info gemini-entry-description">A digital co-pilot providing real time personalised coaching and advice during sales conversations</p> </div> <div id="w-3" class="gemini-snap-scroll-item-center gemini-snap-scroll-item gemini-winner-entry" data-viewport="in-out" data-section-scroll-position="center" data-section-name="w-3"> <p class="gemini-type-b1 gemini-space-d8 gemini-winners-gradient-text gemini-winner-info">Most creative app</p> <p class="gemini-type-h3 gemini-space-d16 gemini-winner-info">Outdraw AI</p> <a href="/competition/projects/outdrawai" class="gemini-winner-entry-button" data-category="content_click" data-label="/competition/projects/outdrawai/" data-action="Outdraw AI"> <div class="gemini-entry-gradient-bg"></div> <div class="gemini-winner-entry-img-container"> <img class="gemini-winner-entry-img" src="/static/images/winners/outdraw-ai.jpg" alt="Outdraw AI"> </div> <div class="gemini-gradient-overlay"></div> <div class="gemini-winner-entry-arrow-button"> <svg class="arrow" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M9.33366 4L8.39366 4.94L10.7803 7.33333H2.66699L2.66699 8.66667H10.7803L8.39366 11.06L9.33366 12L13.3337 8L9.33366 4Z" fill="#161823"/> </svg> </div> </a> <p class="gemini-type-b2 gemini-winner-info gemini-entry-description">Human vs. AI party game where you draw in ways humans understand but AI can't decipher!</p> </div> <div id="w-4" class="gemini-snap-scroll-item-center gemini-snap-scroll-item gemini-winner-entry" data-viewport="in-out" data-section-scroll-position="center" data-section-name="w-4"> <p class="gemini-type-b1 gemini-space-d8 gemini-winners-gradient-text gemini-winner-info">Best Android app</p> <p class="gemini-type-h3 gemini-space-d16 gemini-winner-info">Gaze Link</p> <a href="/competition/projects/gaze-link" class="gemini-winner-entry-button" data-category="content_click" data-label="/competition/projects/gaze-link/" data-action="Gaze Link"> <div class="gemini-entry-gradient-bg"></div> <div class="gemini-winner-entry-img-container"> <img class="gemini-winner-entry-img" src="/static/images/winners/gaze-link.jpg" alt="Gaze Link"> </div> <div class="gemini-gradient-overlay"></div> <div class="gemini-winner-entry-arrow-button"> <svg class="arrow" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M9.33366 4L8.39366 4.94L10.7803 7.33333H2.66699L2.66699 8.66667H10.7803L8.39366 11.06L9.33366 12L13.3337 8L9.33366 4Z" fill="#161823"/> </svg> </div> </a> <p class="gemini-type-b2 gemini-winner-info gemini-entry-description">Helps Amyotrophic Lateral Sclerosis (ALS) patients communicate with their eyes</p> </div> <div id="w-5" class="gemini-snap-scroll-item-center gemini-snap-scroll-item gemini-winner-entry" data-viewport="in-out" data-section-scroll-position="center" data-section-name="w-5"> <p class="gemini-type-b1 gemini-space-d8 gemini-winners-gradient-text gemini-winner-info">Best use of ARCore</p> <p class="gemini-type-h3 gemini-space-d16 gemini-winner-info">Everies</p> <a href="/competition/projects/everies" class="gemini-winner-entry-button" data-category="content_click" data-label="/competition/projects/everies/" data-action="everies"> <div class="gemini-entry-gradient-bg"></div> <div class="gemini-winner-entry-img-container"> <img class="gemini-winner-entry-img" src="/static/images/winners/everies.jpg" alt="everies"> </div> <div class="gemini-gradient-overlay"></div> <div class="gemini-winner-entry-arrow-button"> <svg class="arrow" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M9.33366 4L8.39366 4.94L10.7803 7.33333H2.66699L2.66699 8.66667H10.7803L8.39366 11.06L9.33366 12L13.3337 8L9.33366 4Z" fill="#161823"/> </svg> </div> </a> <p class="gemini-type-b2 gemini-winner-info gemini-entry-description">Scan your surrounding objects and transform them into unique, playful, interactive characters</p> </div> <div id="w-6" class="gemini-snap-scroll-item-center gemini-snap-scroll-item gemini-winner-entry" data-viewport="in-out" data-section-scroll-position="center" data-section-name="w-6"> <p class="gemini-type-b1 gemini-space-d8 gemini-winners-gradient-text gemini-winner-info">Best use of Firebase</p> <p class="gemini-type-h3 gemini-space-d16 gemini-winner-info">Trippy</p> <a href="/competition/projects/trippy" class="gemini-winner-entry-button" data-category="content_click" data-label="/competition/projects/trippy/" data-action="trippy"> <div class="gemini-entry-gradient-bg"></div> <div class="gemini-winner-entry-img-container"> <img class="gemini-winner-entry-img" src="/static/images/winners/trippy.jpg" alt="trippy"> </div> <div class="gemini-gradient-overlay"></div> <div class="gemini-winner-entry-arrow-button"> <svg class="arrow" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M9.33366 4L8.39366 4.94L10.7803 7.33333H2.66699L2.66699 8.66667H10.7803L8.39366 11.06L9.33366 12L13.3337 8L9.33366 4Z" fill="#161823"/> </svg> </div> </a> <p class="gemini-type-b2 gemini-winner-info gemini-entry-description">Plan your next vacation trip with a simple audio or text prompt</p> </div> <div id="w-7" class="gemini-snap-scroll-item-center gemini-snap-scroll-item gemini-winner-entry" data-viewport="in-out" data-section-scroll-position="center" data-section-name="w-7"> <p class="gemini-type-b1 gemini-space-d8 gemini-winners-gradient-text gemini-winner-info">Best use of Flutter</p> <p class="gemini-type-h3 gemini-space-d16 gemini-winner-info">Prospera</p> <a href="/competition/projects/prospera" class="gemini-winner-entry-button" data-category="content_click" data-label="/competition/projects/prospera/" data-action="Prospera"> <div class="gemini-entry-gradient-bg"></div> <div class="gemini-winner-entry-img-container"> <img class="gemini-winner-entry-img" src="/static/images/winners/prospera.jpg" alt="Prospera"> </div> <div class="gemini-gradient-overlay"></div> <div class="gemini-winner-entry-arrow-button"> <svg class="arrow" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M9.33366 4L8.39366 4.94L10.7803 7.33333H2.66699L2.66699 8.66667H10.7803L8.39366 11.06L9.33366 12L13.3337 8L9.33366 4Z" fill="#161823"/> </svg> </div> </a> <p class="gemini-type-b2 gemini-winner-info gemini-entry-description">A digital co-pilot providing real time personalised coaching and advice during sales conversations</p> </div> <div id="w-8" class="gemini-snap-scroll-item-center gemini-snap-scroll-item gemini-winner-entry" data-viewport="in-out" data-section-scroll-position="center" data-section-name="w-8"> <p class="gemini-type-b1 gemini-space-d8 gemini-winners-gradient-text gemini-winner-info">Best web app</p> <p class="gemini-type-h3 gemini-space-d16 gemini-winner-info">ViddyScribe</p> <a href="/competition/projects/viddyscribe" class="gemini-winner-entry-button" data-category="content_click" data-label="/competition/projects/viddyscribe/" data-action="viddyscribe"> <div class="gemini-entry-gradient-bg"></div> <div class="gemini-winner-entry-img-container"> <img class="gemini-winner-entry-img" src="/static/images/winners/viddyscribe.jpg" alt="viddyscribe"> </div> <div class="gemini-gradient-overlay"></div> <div class="gemini-winner-entry-arrow-button"> <svg class="arrow" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M9.33366 4L8.39366 4.94L10.7803 7.33333H2.66699L2.66699 8.66667H10.7803L8.39366 11.06L9.33366 12L13.3337 8L9.33366 4Z" fill="#161823"/> </svg> </div> </a> <p class="gemini-type-b2 gemini-winner-info gemini-entry-description">Adds audio descriptions to videos instantly to make them accessible</p> </div> <div id="w-9" class="gemini-snap-scroll-item-center gemini-snap-scroll-item gemini-winner-entry" data-viewport="in-out" data-section-scroll-position="center" data-section-name="w-9"> <p class="gemini-type-b1 gemini-space-d8 gemini-winners-gradient-text gemini-winner-info">Best game app</p> <p class="gemini-type-h3 gemini-space-d16 gemini-winner-info">PenApple</p> <a href="/competition/projects/pen-apple" class="gemini-winner-entry-button" data-category="content_click" data-label="/competition/projects/pen-apple/" data-action="penapple"> <div class="gemini-entry-gradient-bg"></div> <div class="gemini-winner-entry-img-container"> <img class="gemini-winner-entry-img" src="/static/images/winners/penapple.jpg" alt="penapple"> </div> <div class="gemini-gradient-overlay"></div> <div class="gemini-winner-entry-arrow-button"> <svg class="arrow" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M9.33366 4L8.39366 4.94L10.7803 7.33333H2.66699L2.66699 8.66667H10.7803L8.39366 11.06L9.33366 12L13.3337 8L9.33366 4Z" fill="#161823"/> </svg> </div> </a> <p class="gemini-type-b2 gemini-winner-info gemini-entry-description">Roguelike deck builder where fun, chaos, and stories are created from player interactions</p> </div> <div id="w-10" class="gemini-snap-scroll-item-center gemini-snap-scroll-item gemini-winner-entry" data-viewport="in-out" data-section-scroll-position="center" data-section-name="w-10"> <p class="gemini-type-b1 gemini-space-d8 gemini-winners-gradient-text gemini-winner-info">People’s choice app</p> <p class="gemini-type-h3 gemini-space-d16 gemini-winner-info">VITE VERE</p> <a href="/competition/projects/vite-vere" class="gemini-winner-entry-button" data-category="content_click" data-label="/competition/projects/vite-vere/" data-action="VITE VERE"> <div class="gemini-entry-gradient-bg"></div> <div class="gemini-winner-entry-img-container"> <img class="gemini-winner-entry-img" src="/static/images/winners/vite-vere.jpg" alt="VITE VERE"> </div> <div class="gemini-gradient-overlay"></div> <div class="gemini-winner-entry-arrow-button"> <svg class="arrow" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M9.33366 4L8.39366 4.94L10.7803 7.33333H2.66699L2.66699 8.66667H10.7803L8.39366 11.06L9.33366 12L13.3337 8L9.33366 4Z" fill="#161823"/> </svg> </div> </a> <p class="gemini-type-b2 gemini-winner-info gemini-entry-description">Personalized support to people with cognitive disabilities, promoting autonomy in daily life</p> </div> <div data-viewport="in-out" data-section-name="end" class="gemini-snap-scroll-item-start gemini-snap-scroll-item gemini-depth-top gemini-section-end"> <div class="gemini-section-end-contents"> <h2 class="gemini-type-d1 gemini-space-d32 gemini-end-text" id="build-with-the-gemini-api" data-text=" Build with the Gemini API " tabindex="-1"> Build with the <span class="gemini-gradient-text"><span>Gemini</span> API</span> </h2> <a class="gemini-btn gemini-gradient gemini-type-btn gc-analytics-event" data-category="content_click" data-label="https://aistudio.google.com/app/apikey" data-action="Get API key in AI Studio" href="https://aistudio.google.com/app/apikey" rel="" > <span>Get API key in AI Studio</span> </a> </div> </div> </div> <div class="gemini-floating-ui-container"> <div class="gemini-winner-details gemini-toggle-winners-vis"> <p class="gemini-type-l2 gemini-winner-details-counter"><span class="gemini-progress">01</span>  <span class="gemini-total">/  11</span></p> <div class="gemini-winner-details-titles-mask"> <ul class="gemini-winner-details-titles"> <li class="gemini-type-h3 active">Jayu</li> <li class="gemini-type-h3 ">VITE VERE</li> <li class="gemini-type-h3 ">Prospera</li> <li class="gemini-type-h3 ">Outdraw AI</li> <li class="gemini-type-h3 ">Gaze Link</li> <li class="gemini-type-h3 ">Everies</li> <li class="gemini-type-h3 ">Trippy</li> <li class="gemini-type-h3 ">Prospera</li> <li class="gemini-type-h3 ">ViddyScribe</li> <li class="gemini-type-h3 ">PenApple</li> <li class="gemini-type-h3 ">VITE VERE</li> </ul> </div> <div class="gemini-winner-details-descriptions"> <p class="gemini-type-b1 active gemini-winner-details-description">A personal assistant that seamlessly integrates the Gemini API with a user's device</p> <p class="gemini-type-b1 gemini-winner-details-description">Personalized support to people with cognitive disabilities, promoting autonomy in daily life</p> <p class="gemini-type-b1 gemini-winner-details-description">A digital co-pilot providing real time personalised coaching and advice during sales conversations</p> <p class="gemini-type-b1 gemini-winner-details-description">Human vs. AI party game where you draw in ways humans understand but AI can't decipher!</p> <p class="gemini-type-b1 gemini-winner-details-description">Helps Amyotrophic Lateral Sclerosis (ALS) patients communicate with their eyes</p> <p class="gemini-type-b1 gemini-winner-details-description">Scan your surrounding objects and transform them into unique, playful, interactive characters</p> <p class="gemini-type-b1 gemini-winner-details-description">Plan your next vacation trip with a simple audio or text prompt</p> <p class="gemini-type-b1 gemini-winner-details-description">A digital co-pilot providing real time personalised coaching and advice during sales conversations</p> <p class="gemini-type-b1 gemini-winner-details-description">Adds audio descriptions to videos instantly to make them accessible</p> <p class="gemini-type-b1 gemini-winner-details-description">Roguelike deck builder where fun, chaos, and stories are created from player interactions</p> <p class="gemini-type-b1 gemini-winner-details-description">Personalized support to people with cognitive disabilities, promoting autonomy in daily life</p> </div> <div class="gemini-winner-details-ctas"> <a class="gemini-btn gemini-tertiary gemini-winner-details-cta gemini-type-t3 gc-analytics-event" data-category="content_click" data-label="/competition/projects/jayu/" data-action="View app" href="/competition/projects/jayu" rel="" > <span>View app</span> </a> <a class="gemini-btn gemini-tertiary gemini-winner-details-cta gemini-type-t3 gc-analytics-event" data-category="content_click" data-label="/competition/projects/vite-vere/" data-action="View app" href="/competition/projects/vite-vere" rel="" > <span>View app</span> </a> <a class="gemini-btn gemini-tertiary gemini-winner-details-cta gemini-type-t3 gc-analytics-event" data-category="content_click" data-label="/competition/projects/prospera/" data-action="View app" href="/competition/projects/prospera" rel="" > <span>View app</span> </a> <a class="gemini-btn gemini-tertiary gemini-winner-details-cta gemini-type-t3 gc-analytics-event" data-category="content_click" data-label="/competition/projects/outdrawai/" data-action="View app" href="/competition/projects/outdrawai" rel="" > <span>View app</span> </a> <a class="gemini-btn gemini-tertiary gemini-winner-details-cta gemini-type-t3 gc-analytics-event" data-category="content_click" data-label="/competition/projects/gaze-link/" data-action="View app" href="/competition/projects/gaze-link" rel="" > <span>View app</span> </a> <a class="gemini-btn gemini-tertiary gemini-winner-details-cta gemini-type-t3 gc-analytics-event" data-category="content_click" data-label="/competition/projects/everies/" data-action="View app" href="/competition/projects/everies" rel="" > <span>View app</span> </a> <a class="gemini-btn gemini-tertiary gemini-winner-details-cta gemini-type-t3 gc-analytics-event" data-category="content_click" data-label="/competition/projects/trippy/" data-action="View app" href="/competition/projects/trippy" rel="" > <span>View app</span> </a> <a class="gemini-btn gemini-tertiary gemini-winner-details-cta gemini-type-t3 gc-analytics-event" data-category="content_click" data-label="/competition/projects/prospera/" data-action="View app" href="/competition/projects/prospera" rel="" > <span>View app</span> </a> <a class="gemini-btn gemini-tertiary gemini-winner-details-cta gemini-type-t3 gc-analytics-event" data-category="content_click" data-label="/competition/projects/viddyscribe/" data-action="View app" href="/competition/projects/viddyscribe" rel="" > <span>View app</span> </a> <a class="gemini-btn gemini-tertiary gemini-winner-details-cta gemini-type-t3 gc-analytics-event" data-category="content_click" data-label="/competition/projects/pen-apple/" data-action="View app" href="/competition/projects/pen-apple" rel="" > <span>View app</span> </a> <a class="gemini-btn gemini-tertiary gemini-winner-details-cta gemini-type-t3 gc-analytics-event" data-category="content_click" data-label="/competition/projects/vite-vere/" data-action="View app" href="/competition/projects/vite-vere" rel="" > <span>View app</span> </a> </div> </div> <div class="gemini-winner-categories gemini-toggle-winners-vis"> <p class="gemini-type-l2 gemini-winner-categories-title">All winners (9)</p> <div class="gemini-spark-bullet"> <svg width="44" height="44" fill="none" xmlns="http://www.w3.org/2000/svg"><g opacity=".6" filter="url(#a)"><path d="M22.04 12.04c0 1.371.259 2.638.77 3.844a10.283 10.283 0 0 0 2.143 3.163 10.283 10.283 0 0 0 3.163 2.142 9.686 9.686 0 0 0 3.845.771.04.04 0 1 1 0 .08 9.428 9.428 0 0 0-3.845.796 9.937 9.937 0 0 0-3.163 2.117 10.279 10.279 0 0 0-2.142 3.162 9.686 9.686 0 0 0-.772 3.846.04.04 0 1 1-.079 0 9.426 9.426 0 0 0-.797-3.846 9.938 9.938 0 0 0-2.116-3.162 9.936 9.936 0 0 0-3.164-2.117 9.422 9.422 0 0 0-3.844-.797.04.04 0 1 1 0-.079 9.68 9.68 0 0 0 3.844-.771 10.282 10.282 0 0 0 3.164-2.142 9.929 9.929 0 0 0 2.116-3.163 9.423 9.423 0 0 0 .797-3.845.04.04 0 0 1 .079 0Z" fill="url(#b)"/></g><path d="M22.04 12.04c0 1.371.259 2.638.77 3.844a10.283 10.283 0 0 0 2.143 3.163 10.283 10.283 0 0 0 3.163 2.142 9.686 9.686 0 0 0 3.845.771.04.04 0 1 1 0 .08 9.428 9.428 0 0 0-3.845.796 9.937 9.937 0 0 0-3.163 2.117 10.279 10.279 0 0 0-2.142 3.162 9.686 9.686 0 0 0-.772 3.846.04.04 0 1 1-.079 0 9.426 9.426 0 0 0-.797-3.846 9.938 9.938 0 0 0-2.116-3.162 9.936 9.936 0 0 0-3.164-2.117 9.422 9.422 0 0 0-3.844-.797.04.04 0 1 1 0-.079 9.68 9.68 0 0 0 3.844-.771 10.282 10.282 0 0 0 3.164-2.142 9.929 9.929 0 0 0 2.116-3.163 9.423 9.423 0 0 0 .797-3.845.04.04 0 0 1 .079 0Z" fill="url(#c)"/><g style="mix-blend-mode:plus-lighter" filter="url(#d)"><path d="M22.04 12.04c0 1.371.259 2.638.77 3.844a10.283 10.283 0 0 0 2.143 3.163 10.283 10.283 0 0 0 3.163 2.142 9.686 9.686 0 0 0 3.845.771.04.04 0 1 1 0 .08 9.428 9.428 0 0 0-3.845.796 9.937 9.937 0 0 0-3.163 2.117 10.279 10.279 0 0 0-2.142 3.162 9.686 9.686 0 0 0-.772 3.846.04.04 0 1 1-.079 0 9.426 9.426 0 0 0-.797-3.846 9.938 9.938 0 0 0-2.116-3.162 9.936 9.936 0 0 0-3.164-2.117 9.422 9.422 0 0 0-3.844-.797.04.04 0 1 1 0-.079 9.68 9.68 0 0 0 3.844-.771 10.282 10.282 0 0 0 3.164-2.142 9.929 9.929 0 0 0 2.116-3.163 9.423 9.423 0 0 0 .797-3.845.04.04 0 0 1 .079 0Z" fill="url(#e)"/></g><defs><linearGradient id="b" x1="19.072" y1="25.776" x2="26.7" y2="16.728" gradientUnits="userSpaceOnUse"><stop stop-color="#217BFE"/><stop offset=".27" stop-color="#078EFB"/><stop offset=".777" stop-color="#A190FF"/><stop offset="1" stop-color="#BD99FE"/></linearGradient><linearGradient id="c" x1="19.072" y1="25.776" x2="33.842" y2="7.088" gradientUnits="userSpaceOnUse"><stop stop-color="#217BFE"/><stop offset=".27" stop-color="#078EFB"/><stop offset=".777" stop-color="#A190FF"/><stop offset="1" stop-color="#BD99FE"/></linearGradient><linearGradient id="e" x1="19.072" y1="25.776" x2="26.7" y2="16.728" gradientUnits="userSpaceOnUse"><stop stop-color="#217BFE" stop-opacity="0"/><stop offset=".27" stop-color="#078EFB" stop-opacity="0"/><stop offset=".777" stop-color="#A190FF"/><stop offset="1" stop-color="#BD99FE"/></linearGradient><filter id="a" x=".712" y=".712" width="42.575" height="42.575" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur stdDeviation="5.644" result="effect1_foregroundBlur_30133_12221"/></filter><filter id="d" x="8.491" y="8.491" width="27.017" height="27.017" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur stdDeviation="1.754" result="effect1_foregroundBlur_30133_12221"/></filter></defs></svg> </div> <ul class="gemini-winner-categories-list gemini-type-b1 gemini-anchors-list"> <li class="gemini-winner-categories-list-item gemini-anchor" data-section-target="w-0"> <a class="gemini-layout-zstack" href="#w-0"> <span inert>Best overall app</span> <span class="gemini-winners-gradient-text">Best overall app</span> </a> </li> <li class="gemini-winner-categories-list-item gemini-anchor" data-section-target="w-1"> <a class="gemini-layout-zstack" href="#w-1"> <span inert>Most impactful app</span> <span class="gemini-winners-gradient-text">Most impactful app</span> </a> </li> <li class="gemini-winner-categories-list-item gemini-anchor" data-section-target="w-2"> <a class="gemini-layout-zstack" href="#w-2"> <span inert>Most useful app</span> <span class="gemini-winners-gradient-text">Most useful app</span> </a> </li> <li class="gemini-winner-categories-list-item gemini-anchor" data-section-target="w-3"> <a class="gemini-layout-zstack" href="#w-3"> <span inert>Most creative app</span> <span class="gemini-winners-gradient-text">Most creative app</span> </a> </li> <li class="gemini-winner-categories-list-item gemini-anchor" data-section-target="w-4"> <a class="gemini-layout-zstack" href="#w-4"> <span inert>Best Android app</span> <span class="gemini-winners-gradient-text">Best Android app</span> </a> </li> <li class="gemini-winner-categories-list-item gemini-anchor" data-section-target="w-5"> <a class="gemini-layout-zstack" href="#w-5"> <span inert>Best use of ARCore</span> <span class="gemini-winners-gradient-text">Best use of ARCore</span> </a> </li> <li class="gemini-winner-categories-list-item gemini-anchor" data-section-target="w-6"> <a class="gemini-layout-zstack" href="#w-6"> <span inert>Best use of Firebase</span> <span class="gemini-winners-gradient-text">Best use of Firebase</span> </a> </li> <li class="gemini-winner-categories-list-item gemini-anchor" data-section-target="w-7"> <a class="gemini-layout-zstack" href="#w-7"> <span inert>Best use of Flutter</span> <span class="gemini-winners-gradient-text">Best use of Flutter</span> </a> </li> <li class="gemini-winner-categories-list-item gemini-anchor" data-section-target="w-8"> <a class="gemini-layout-zstack" href="#w-8"> <span inert>Best web app</span> <span class="gemini-winners-gradient-text">Best web app</span> </a> </li> <li class="gemini-winner-categories-list-item gemini-anchor" data-section-target="w-9"> <a class="gemini-layout-zstack" href="#w-9"> <span inert>Best game app</span> <span class="gemini-winners-gradient-text">Best game app</span> </a> </li> <li class="gemini-winner-categories-list-item gemini-anchor" data-section-target="w-10"> <a class="gemini-layout-zstack" href="#w-10"> <span inert>People’s choice app</span> <span class="gemini-winners-gradient-text">People’s choice app</span> </a> </li> </ul> </div> <ul class="gemini-anchors-list"> <li class="gemini-anchor gemini-winners-scroll-cta-wrapper" data-section-target="congrats"> <a href="#congrats" class="gemini-down-arrow-cta gemini-underline-cta gemini-type-l2 gemini-winners-scroll-cta gemini-toggle-intro-vis">Explore winners</a> </li> </ul> <div class="gemini-video-cta active gemini-dialog-cta gemini-toggle-intro-vis" data-dialog-target="gemini-winners-video"> <div class="gemini-video-flex"> <button class="gemini-video-button"> <div class="gemini-video-img-container"> <img src="/static/images/winners/video-thumb.jpg" alt="play video"> </div> </button> <p class="gemini-type-t3">Christopher Lloyd didn’t win.<br/><span class="gemini-text-color-grey-400">So, who are our winners?</span></p> </div> </div> </div> <div data-viewport="once" class="gemini-winners-gradient-background"></div> <div data-viewport="once" class="gemini-black-overlay"></div> <dialog class="gemini-dialog gemini-video-dialog" data-dialog="gemini-winners-video" > <div class="gemini-dialog__backdrop gemini-dialog-close" ></div> <div class="gemini-dialog-inner"> <div class="gemini-dialog__content"> <button class="gemini-dialog__close-button gemini-dialog-close" > <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M7.00391 7L17.0802 17.0763" stroke="#060606" stroke-width="1.33594" stroke-linecap="round"/> <path d="M17.0781 7L7.00185 17.0763" stroke="#060606" stroke-width="1.33594" stroke-linecap="round"/> </svg> </button> <div class="gemini-dialog-body"> <devsite-video video-id="yeAu6ZQC0zc"></devsite-video> </div> </div> </div> </dialog> </devsite-gemini-winners-page> </div> <div class="devsite-floating-action-buttons"> </div> </article> <devsite-notification > </devsite-notification> <div class="devsite-content-data"> <template class="devsite-thumb-rating-feedback"> <devsite-feedback position="thumb-rating" project-name="Gemini API Developer Competition" product-id="5292923" bucket="documentation" context="" version="t-devsite-webserver-20241114-r00-rc02.464921008191574316" data-label="Send Feedback Button" track-type="feedback" track-name="sendFeedbackLink" track-metadata-position="thumb-rating" class="nocontent" project-icon="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/googledevai/images/touchicon-180-new.png" > <button> Need to tell us more? </button> </devsite-feedback> </template> <template class="devsite-content-data-template"> [[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],[],[],[]] </template> </div> </devsite-content> </main> <devsite-footer-promos class="devsite-footer"> </devsite-footer-promos> <devsite-footer-linkboxes class="devsite-footer"> <nav class="devsite-footer-linkboxes nocontent" aria-label="Footer links"> </nav> </devsite-footer-linkboxes> <devsite-footer-utility class="devsite-footer"> <div class="devsite-footer-utility nocontent"> <nav class="devsite-footer-utility-links" aria-label="Utility links"> <ul class="devsite-footer-utility-list"> <li class="devsite-footer-utility-item "> <a class="devsite-footer-utility-link gc-analytics-event" href="//policies.google.com/terms" data-category="Site-Wide Custom Events" data-label="Footer Terms link" > Terms </a> </li> <li class="devsite-footer-utility-item "> <a class="devsite-footer-utility-link gc-analytics-event" href="//policies.google.com/privacy" data-category="Site-Wide Custom Events" data-label="Footer Privacy link" > Privacy </a> </li> <li class="devsite-footer-utility-item glue-cookie-notification-bar-control"> <a class="devsite-footer-utility-link gc-analytics-event" href="#" data-category="Site-Wide Custom Events" data-label="Footer Manage cookies link" aria-hidden="true" > Manage cookies </a> </li> </ul> <devsite-language-selector> <ul role="presentation"> <li role="presentation"> <a role="menuitem" lang="en" >English</a> </li> <li role="presentation"> <a role="menuitem" lang="de" >Deutsch</a> </li> <li role="presentation"> <a role="menuitem" lang="es_419" >Español – América Latina</a> </li> <li role="presentation"> <a role="menuitem" lang="fr" >Français</a> </li> <li role="presentation"> <a role="menuitem" lang="id" >Indonesia</a> </li> <li role="presentation"> <a role="menuitem" lang="it" >Italiano</a> </li> <li role="presentation"> <a role="menuitem" lang="pl" >Polski</a> </li> <li role="presentation"> <a role="menuitem" lang="pt_br" >Português – Brasil</a> </li> <li role="presentation"> <a role="menuitem" lang="vi" >Tiếng Việt</a> </li> <li role="presentation"> <a role="menuitem" lang="tr" >Türkçe</a> </li> <li role="presentation"> <a role="menuitem" lang="ru" >Русский</a> </li> <li role="presentation"> <a role="menuitem" lang="he" >עברית</a> </li> <li role="presentation"> <a role="menuitem" lang="ar" >العربيّة</a> </li> <li role="presentation"> <a role="menuitem" lang="fa" >فارسی</a> </li> <li role="presentation"> <a role="menuitem" lang="hi" >हिंदी</a> </li> <li role="presentation"> <a role="menuitem" lang="bn" >বাংলা</a> </li> <li role="presentation"> <a role="menuitem" lang="th" >ภาษาไทย</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_cn" >中文 – 简体</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_tw" >中文 – 繁體</a> </li> <li role="presentation"> <a role="menuitem" lang="ja" >日本語</a> </li> <li role="presentation"> <a role="menuitem" lang="ko" >한국어</a> </li> </ul> </devsite-language-selector> </nav> </div> </devsite-footer-utility> <devsite-panel></devsite-panel> </section></section> <devsite-sitemask></devsite-sitemask> <devsite-snackbar></devsite-snackbar> <devsite-tooltip ></devsite-tooltip> <devsite-heading-link></devsite-heading-link> <devsite-analytics> <script type="application/json" analytics>[]</script> <script type="application/json" tag-management>{"at": "True", "ga4": [], "ga4p": [], "gtm": [{"id": "GTM-TC2MQKS8", "purpose": 0}], "parameters": {"internalUser": "False", "language": {"machineTranslated": "False", "requested": "en", "served": "en"}, "pageType": "marketing", "projectName": "Gemini API Developer Competition", "signedIn": "False", "tenant": "googledevai", "recommendations": {"sourcePage": "", "sourceType": 0, "sourceRank": 0, "sourceIdenticalDescriptions": 0, "sourceTitleWords": 0, "sourceDescriptionWords": 0, "experiment": ""}, "experiment": {"ids": ""}}}</script> </devsite-analytics> <devsite-badger></devsite-badger> <script nonce="vYakW99+JxcGNbINKNGeBVRxxt9vow"> (function(d,e,v,s,i,t,E){d['GoogleDevelopersObject']=i; t=e.createElement(v);t.async=1;t.src=s;E=e.getElementsByTagName(v)[0]; E.parentNode.insertBefore(t,E);})(window, document, 'script', 'https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/googledevai/js/app_loader.js', '[59,"en",null,"/js/devsite_app_module.js","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/googledevai","https://googledevai-dot-devsite-v2-prod-3p.appspot.com",1,null,["/_pwa/googledevai/manifest.json","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/images/video-placeholder.svg","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/googledevai/images/favicon-new.png","/_static/googledevai/images/lockup-new.svg","https://fonts.googleapis.com/css?family=Google+Sans:400,500|Roboto:400,400italic,500,500italic,700,700italic|Roboto+Mono:400,500,700&display=swap"],1,null,[1,6,8,12,14,17,21,25,50,52,63,70,75,76,80,87,91,92,93,97,98,100,101,102,103,104,105,107,108,109,110,112,113,117,118,120,122,124,125,126,127,129,130,131,132,133,134,135,136,138,140,141,147,148,149,151,152,156,157,158,159,161,163,164,168,169,170,179,180,182,183,186,191,193,196],"AIzaSyCNm9YxQumEXwGJgTDjxoxXK6m1F-9720Q","AIzaSyCc76DZePGtoyUjqKrLdsMGk_ry7sljLbY","ai.google.dev","AIzaSyB9bqgQ2t11WJsOX8qNsCQ6U-w91mmqF-I","AIzaSyAdYnStPdzjcJJtQ0mvIaeaMKj7_t6J_Fg",null,null,null,["Experiments__reqs_query_experiments","MiscFeatureFlags__developers_footer_dark_image","MiscFeatureFlags__enable_firebase_utm","Profiles__enable_page_saving","DevPro__enable_cloud_innovators_plus","Cloud__enable_cloud_dlp_service","Profiles__enable_awarding_url","Analytics__enable_clearcut_logging","Profiles__enable_release_notes_notifications","MiscFeatureFlags__enable_explain_this_code","OnSwitch__enable","Profiles__enable_completecodelab_endpoint","TpcFeatures__enable_required_headers","Search__enable_suggestions_from_borg","Profiles__enable_developer_profiles_callout","Cloud__enable_llm_concierge_chat","Cloud__enable_cloud_shell_fte_user_flow","Profiles__enable_public_developer_profiles","Search__enable_page_map","CloudShell__cloud_code_overflow_menu","Search__enable_dynamic_content_confidential_banner","MiscFeatureFlags__enable_variable_operator","EngEduTelemetry__enable_engedu_telemetry","MiscFeatureFlags__developers_footer_image","Cloud__enable_free_trial_server_call","DevPro__enable_developer_subscriptions","MiscFeatureFlags__enable_view_transitions","TpcFeatures__enable_mirror_tenant_redirects","Cloud__enable_cloudx_experiment_ids","BookNav__enable_tenant_cache_key","Profiles__require_profile_eligibility_for_signin","Cloud__enable_cloudx_ping","Cloud__enable_cloud_facet_chat","CloudShell__cloud_shell_button","Profiles__enable_complete_playlist_endpoint","Concierge__enable_pushui","Cloud__enable_cloud_shell","Search__enable_ai_eligibility_checks","Profiles__enable_recognition_badges","Profiles__enable_profile_collections","Cloud__enable_legacy_calculator_redirect","MiscFeatureFlags__enable_project_variables","Profiles__enable_dashboard_curated_recommendations","MiscFeatureFlags__emergency_css"],null,null,"AIzaSyA58TaKli1DculwmAmbpzLVGuWc8eCQgQc","https://developerscontentserving-pa.googleapis.com","AIzaSyDWBU60w0P9hEkr29kkksYs8Z7gvZ8u_wc","https://developerscontentsearch-pa.googleapis.com",2,4,null,"https://developerprofiles-pa.googleapis.com",[59,"googledevai","Google AI for Developers","ai.google.dev",null,"googledevai-dot-devsite-v2-prod-3p.appspot.com",null,null,[null,1,null,null,null,null,null,null,null,null,null,[1],null,null,null,null,null,null,[1],null,null,null,null,[1,null,1],[1,1,null,1,1]],null,[73,null,null,null,null,null,"/images/lockup-new.svg","/images/touchicon-180-new.png",null,null,null,null,1,1,null,null,null,null,null,null,null,1,null,null,null,"/images/lockup-dark-theme-new.svg",[]],[],null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,[[],[1,1]],[[null,null,null,null,null,["GTM-TC2MQKS8"],null,null,null,null,null,[["GTM-TC2MQKS8",1]],1]],null,4]]') </script> <devsite-a11y-announce></devsite-a11y-announce> </body> </html>

CINXE.COM

Google Gemini Winners | Gemini API Developer Competition | Google AI for Developers