CINXE.COM
Gemini Developer API | Gemma open models | Google AI for Developers
<!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/"><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/" /><link rel="alternate" hreflang="x-default" href="https://ai.google.dev/" /><title>Gemini Developer API | Gemma open models | Google AI for Developers</title> <meta property="og:title" content="Gemini Developer API | Gemma open models | Google AI for Developers"><meta name="description" content="Build with Gemini 1.5 Flash and 1.5 Pro using the Gemini API and Google AI Studio, or access our Gemma open models."> <meta property="og:description" content="Build with Gemini 1.5 Flash and 1.5 Pro using the Gemini API and Google AI Studio, or access our Gemma open models."><meta property="og:url" content="https://ai.google.dev/"><meta property="og:image" content="https://ai.google.dev/static/site-assets/images/share-ai-dev.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"><script type="application/ld+json"> { "@context": "http://schema.org/", "@type": "Organization", "name": "Google AI for Developers", "logo": "https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/googledevai/images/touchicon-180-new.png", "url": "https://ai.google.dev/" } </script> <script type="application/ld+json"> { "@context": "http://schema.org", "@type": "WebSite", "name": "Google AI for Developers", "url": "https://ai.google.dev/", "potentialAction": { "@type": "SearchAction", "target": "https://ai.google.dev/s/results?q={search_term_string}", "query-input": "required name=search_term_string" } } </script> <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="gemini api,google gemini,ai studio, google ai studio, gemini api python, gemini developers"> <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="googleAIForDevelopers" 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="Google AI for Developers"> </picture> </a> <span class="devsite-product-name"> <ul class="devsite-breadcrumb-list" > <li class="devsite-breadcrumb-item devsite-has-google-wordmark"> </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="Google AI for Developers" 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-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="googleAIForDevelopers" 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="Google AI for Developers"> </picture> </a> <span class="devsite-product-name"> <ul class="devsite-breadcrumb-list" > <li class="devsite-breadcrumb-item devsite-has-google-wordmark"> </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/landing.css */ .gemini-page.gemini-landing { display: block; padding-block-end: 48px; --gradient-CTA-border-color: linear-gradient(43deg, #217BFE 1.02%, #078EFB 28.51%, #AC87EB 90.12%); --gemini-text-gradient: linear-gradient(90deg, #217BFE 0%, #078EFB 33.53%, #AC87EB 67.74%, #EE4D5D 100%); } #gemini-api { padding-block-start: 60px; position: relative; z-index: 7; } @media (min-width: 834px) { #gemini-api { padding-block-start: 80px; } } /** Gemini Section: Hero */ .gemini-landing-hero { --gemini-heading-max-width: 100%; --gemini-gradient-y: 70%; --gemini-gradient-height: 200px; } @media screen and (min-width: 834px) { .gemini-landing-hero { --gemini-gradient-height: 300px; } } .gemini-landing-hero .gemini-section--hero { position: relative; z-index: 5; } .gemini-landing-hero:before { aspect-ratio: 1440/1520; background-image: url("/images/hero-gradient.jpg"); background-size: 140%; background-repeat: no-repeat; background-position: center -240px; content: ""; inline-size: 100vw; inset-block-start: 0; inset-inline-start: 50%; max-inline-size: 1440px; position: absolute; transform: translate(-50%, 0); z-index: 0; transition: opacity 0.8s var(--gemini-ease-out-quad); } @media screen and (min-width: 834px) { .gemini-landing-hero:before { inline-size: 100%; background-size: contain; aspect-ratio: 1440/1087; transform: translate(-50%, 0); } } .gemini-landing-hero .gemini-layer--content { padding-block-start: 120px; } @media (min-width: 834px) { .gemini-landing-hero .gemini-layer--content { padding-block-start: 210px; } } .gemini-landing-hero .gemini-block--start { display: none; } @media (min-width: 834px) { .gemini-landing-hero .gemini-block--start { transform: translateY(-40px); display: block; } } .gemini-landing-hero .gemini-block--start .gemini-svg { aspect-ratio: 1440/350; min-block-size: var(--gemini-min-svg-height); } .gemini-landing-hero .gemini-hero-title { justify-content: center; } .gemini-landing-hero .gemini-landing-arrow-link { display: flex; justify-content: center; gap: 4px; align-items: center; opacity: 0; transition: opacity 0.4s 0.5s var(--gemini-ease-in-cubic); } .gemini-landing-hero .gemini-onscreen .gemini-landing-arrow-link { opacity: 1; } /** Gemini: Partners section */ .gemini-section-partners-element { display: block; } .gemini-partner-header { --gemini-heading-max-width: 320px; } @media screen and (min-width: 834px) { .gemini-partner-header { --gemini-heading-max-width: 550px; } } .gemini-section-partners-element .gemini-section--partners { --gemini-space: var(--gemini-space-d40); inline-size: 100%; text-align: center; } .gemini-section-partners-element .gemini-section-header { opacity: 0; transform: translateY(80px); transition: transform 0.5s var(--gemini-ease-out-quad), opacity 0.1s linear; } .gemini-section-partners-element .gemini-onscreen .gemini-section-header { transform: translateY(0); opacity: 1; } /** 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-page .gemini-partner-rows { display: flex; flex-direction: column; gap: var(--gemini-space-d48); max-inline-size: 800px; margin-inline: auto; } /** Gemini: Section Gemma */ .gemini-gemma-preview .gemini-star-logo { inline-size: 80px; margin-inline: auto; } @media (min-width: 834px) { .gemini-gemma-preview .gemini-star-logo { inline-size: 120px; } } .gemini-gemma-preview .gemini-btn.gemini-secondary { background-color: var(--gemini-color-white); color: var(--gemini-color-grey-900); --gemini-button-border: var(--gemini-color-white); } .gemini-gemma-preview .gemini-btn.gemini-secondary:hover { color: var(--gemini-color-blue); } @media (min-width: 834px) { .gemini-gemma-preview .gemini-section-inner { border-radius: 24px; } } .gemini-landing-community { overflow: hidden; } .gemini-landing-community .gemini-community-cta { padding-block-end: 80px; position: relative; z-index: 6; } @media screen and (min-width: 834px) { .gemini-landing-community .gemini-community-cta { padding-block-end: 172px; } } .gemini-landing-community .gemini-bottom-svg { transform: translateY(48px); display: none; align-items: flex-end; position: relative; z-index: 4; } @media screen and (min-width: 834px) { .gemini-landing-community .gemini-bottom-svg { display: flex; } } </style><style> /* Styles inlined from /site-assets/css/landing.css */ .devsite-banner-message-text { margin: auto; } </style> <div class="devsite-banner devsite-banner-announcement nocontent" background="google-blue" > <div class="devsite-banner-message"> <div class="devsite-banner-message-text"> Check out the winners from the Gemini API Developer Competition! <a class="button button-primary" href="/competition">View</a> </div> </div> </div> <div class="devsite-article-meta nocontent" role="navigation"> <ul class="devsite-breadcrumb-list" > <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="Google AI for Developers" > Google AI for Developers </a> </li> </ul> </div> <devsite-feedback position="header" project-name="Google AI for Developers" 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-toc class="devsite-nav" depth="2" devsite-toc-embedded disabled> </devsite-toc> <div class="devsite-article-body clearfix devsite-no-page-title"> <devsite-gemini-landing-page class="gemini-page gemini-landing"> <section id="overview" class="gemini-space-d120 gemini-section" data-viewport data-section-name="overview"> <div class="gemini-landing-hero" id="gemini-overview"> <section class="gemini-section gemini-section--hero gemini-layout-zstack" data-viewport="once" data-viewport-threshold="0.5" > <div class="gemini-layer gemini-layer--bg"> <div class="gemini-block gemini-block--start"> <div class="gemini-svg gemini-lottie-lines" data-lottie="/lottie/top-landing.json" data-lottie-name="bg-top"></div> </div> </div> <div class="gemini-layer gemini-layer--content"> <div> <div class="gemini-section-cta gemini-space-d32" style=""> <article class="gemini-cta " data-viewport="once" data-viewport-threshold="0.3" > <div class="gemini-section gemini-section__subtitle"> </div> <div class="gemini-section gemini-section__title"> <h1 class="gemini-hero-title gemini-type-d2 gemini-space-d32" id="ai-for-every-developer" data-text=" AI for every developer " tabindex="-1"> AI for every developer </h1> </div> <div class="gemini-section gemini-section__copy"> <p class="gemini-hero-subtitle gemini-type-t1 gemini-space-d64"> Build with state-of-the-art generative AI models and tools to make AI helpful for everyone </p> </div> <div class="gemini-section gemini-section__buttons"> <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 an API key in Google AI Studio" href="https://aistudio.google.com/app/apikey" rel="" > <span>Get API key in Google AI Studio</span> </a> <a class="gemini-btn gemini-secondary gemini-type-btn gc-analytics-event" data-category="content_click" data-label="https://ai.google.dev/gemini-api/docs" data-action="Read the Gemini API docs" href="https://ai.google.dev/gemini-api/docs" rel="" > <span>Read API docs</span> </a> </div> </article> </div> <div class="gemini-landing-arrow-link"> <a class="gemini-arrow-link gemini-type-btn gemini-layout-inline" href="https://ai.google.dev/gemini-api/docs/quickstart" data-category="content_click" data-label="https://ai.google.dev/gemini-api/docs/quickstart" data-action="Get started building" > <span>Get started building in less than 5 minutes</span> <span class="gemini-arrow"> <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M5.05957 12.3932L5.99957 13.3332L11.3329 7.99984L5.99957 2.6665L5.05957 3.6065L9.44624 7.99984" fill="white"/> </svg> </span> </a> </div> </div> </div> </section> </div> </section> <div class="gemini-sticky-nav" data-viewport="once" data-viewport-threshold="0.1"> <ul class="gemini-nav"> <li class="gemini-nav__item" data-section-target="overview"><a class="gemini-type-t3" href="#overview">Overview</a></li> <li class="gemini-nav__item" data-section-target="gemini-api"><a class="gemini-type-t3" href="#gemini-api">Gemini API</a></li> <li class="gemini-nav__item" data-section-target="develop-with-gemini"><a class="gemini-type-t3" href="#develop-with-gemini">Develop with Gemini</a></li> <li class="gemini-nav__item" data-section-target="gemma-open-models"><a class="gemini-type-t3" href="#gemma-open-models">Gemma open models</a></li> <li class="gemini-nav__item" data-section-target="community"><a class="gemini-type-t3" href="#community">Community</a></li> </ul> </div> <section id="gemini-api" class="gemini-section gemini-space-d180" data-viewport data-section-name="gemini-api"> <div class="gemini-layout-max-width"> <div class="gemini-background-wrapper gemini-background-dark"> <div class="gemini-section-details-element gemini-has-ring"> <section class="gemini-section gemini-section--details" data-viewport="once" data-viewport-threshold="0"> <div class="gemini-details__header gemini-space-d88"> <div class="gemini-header__inner"> <div class="gemini-section-cta " style=""> <article class="gemini-cta " data-viewport="once" data-viewport-threshold="0.3" > <div class="gemini-section gemini-section__subtitle"> </div> <div class="gemini-section gemini-section__title"> <h2 class="gemini-type-d4 gemini-space-d32" 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> </div> <div class="gemini-section gemini-section__copy"> <p class="gemini-type-t1"> Easily integrate Google鈥檚 largest and most capable AI model to your apps </p> </div> <div class="gemini-section gemini-section__buttons"> </div> </article> </div> </div> </div> <div class="gemini-details__body gemini-layout-grid"> <div class="gemini-details"> <div class="gemini-module-code-element"> <section class="gemini-module gemini-module--code gemini-onscreen" data-viewport="once" data-viewport-threshold="0.2"> <div class="gemini-code__wrapper"> <div class="gemini-code-preview-element"> <article class="gemini-code-preview"> <div class="gemini-window gemini-type-code gemini-tabs-component"> <nav class="gemini-tabs gemini-type-t2"> <ul class="gemini-tabs__links"> <li> <button data-tab="python" class="gemini-layout-zstack"> <span>Python</span> <span inert>Python</span> </button> </li> <li> <button data-tab="nodejs" class="gemini-layout-zstack"> <span>Node.js</span> <span inert>Node.js</span> </button> </li> <li> <button data-tab="rest" class="gemini-layout-zstack"> <span>REST</span> <span inert>REST</span> </button> </li> <li> <button data-tab="go" class="gemini-layout-zstack"> <span>Go</span> <span inert>Go</span> </button> </li> <li> <button data-tab="kotlin" class="gemini-layout-zstack"> <span>Android</span> <span inert>Android</span> </button> </li> <li> <button data-tab="dart" class="gemini-layout-zstack"> <span>Dart (Flutter)</span> <span inert>Dart (Flutter)</span> </button> </li> <li> <button data-tab="swift" class="gemini-layout-zstack"> <span>Swift</span> <span inert>Swift</span> </button> </li> </ul> </nav> <div class="gemini-editor gemini-tabs-data"> <div class="gemini-editor__numbers" inert> </div> <div></div><devsite-code><pre data-tab="python" class="gemini-editor__code devsite-disable-code-toggle" hidden spellcheck="false" translate="no" dir="ltr" is-upgraded> import google.generativeai as genai import os genai.configure(api_key=os.environ["GEMINI_API_KEY"]) model = genai.GenerativeModel(model_name="<span class="gemini-highlight">gemini-1.5-flash</span>") response = model.generate_content("Explain how AI works") print(response.text) </pre></devsite-code> <div></div><devsite-code><pre data-tab="nodejs" class="gemini-editor__code devsite-disable-code-toggle" hidden spellcheck="false" translate="no" dir="ltr" is-upgraded> const { GoogleGenerativeAI } = require("@google/generative-ai"); const genAI = new GoogleGenerativeAI(process.env.GEMINI_API_KEY); async function run() { const model = genAI.getGenerativeModel({ model: "<span class="gemini-highlight">gemini-1.5-flash</span>"}); const result = await model.generateContent(["Explain how AI works"]); console.log(result.response.text()); } run(); </pre></devsite-code> <div></div><devsite-code><pre data-tab="rest" class="gemini-editor__code devsite-disable-code-toggle" hidden spellcheck="false" translate="no" dir="ltr" is-upgraded> curl https://generativelanguage.googleapis.com/v1beta/models/<span class="gemini-highlight">gemini-1.5-flash</span>:generateContent?key=${GEMINI_API_KEY} \ -H 'Content-Type: application/json' \ -d '{ "contents":[{ "parts":[ {"text": "Explain how AI works"}, ] }] }' </pre></devsite-code> <div></div><devsite-code><pre data-tab="go" class="gemini-editor__code devsite-disable-code-toggle" hidden spellcheck="false" translate="no" dir="ltr" is-upgraded> import "github.com/google/generative-ai-go/genai" import "google.golang.org/api/option" ctx := context.Background() client, err := genai.NewClient(ctx, option.WithAPIKey(os.Getenv("GEMINI_API_KEY"))) model := client.GenerativeModel("<span class="gemini-highlight">gemini-1.5-flash</span>") resp, err := model.GenerateContent(ctx,genai.Text("Explain how AI works")) </pre></devsite-code> <div></div><devsite-code><pre data-tab="kotlin" class="gemini-editor__code devsite-disable-code-toggle" hidden spellcheck="false" translate="no" dir="ltr" is-upgraded> val model = GenerativeModel("<span class="gemini-highlight">gemini-1.5-flash</span>") val response = model.generateContent(content { text("Explain how AI works") }) </pre></devsite-code> <div></div><devsite-code><pre data-tab="swift" class="gemini-editor__code devsite-disable-code-toggle" hidden spellcheck="false" translate="no" dir="ltr" is-upgraded> let model = GenerativeModel(name: "<span class="gemini-highlight">gemini-1.5-flash</span>") let response = try await model.generateContent("Explain how AI works") </pre></devsite-code> <div></div><devsite-code><pre data-tab="dart" class="gemini-editor__code devsite-disable-code-toggle" hidden spellcheck="false" translate="no" dir="ltr" is-upgraded> final model = GenerativeModel(model: "<span class="gemini-highlight">gemini-1.5-flash</span>", apiKey: apiKey); final response = await model.generateContent([ Content.text("Explain how AI works"), ]); </pre></devsite-code> </div> </div> <div class="gemini-details-cta"> <a class="gemini-btn gemini-gradient gemini-type-btn gc-analytics-event" data-category="content_click" data-label="https://aistudio.google.com/app/prompts/new_chat" data-action="Try Gemini in Google AI Studio" href="https://aistudio.google.com/app/prompts/new_chat" rel="" > <span>Try Gemini in Google AI Studio</span> </a> </div> </article> </div> </div> </section> </div> </div> </div> </section> </div> </div> </div> </section> <section id="develop-with-gemini" class="gemini-section" data-viewport data-section-name="develop-with-gemini"> <div class="gemini-section-partners-element gemini-space-d180 gemini-gradient-cover--top"> <section class="gemini-section gemini-section--partners"> <div class="gemini-section__inner gemini-layout-max-width"> <div class="gemini-partner-header gemini-space-d64"> <div class="gemini-section-cta " style=""> <article class="gemini-cta " data-viewport="once" data-viewport-threshold="0.3" > <div class="gemini-section gemini-section__subtitle"> </div> <div class="gemini-section gemini-section__title"> <h3 class="gemini-type-d4 gemini-space-d32" id="develop-with-gemini-assistance" data-text="Develop with Gemini assistance" tabindex="-1">Develop with <span class="gemini-gradient-text"><span>Gemini</span></span> assistance</h3> </div> <div class="gemini-section gemini-section__copy"> </div> <div class="gemini-section gemini-section__buttons"> </div> </article> </div> </div> <article class="gemini-partner-rows gemini-space-d64"> <section class="gemini-row"> <div class="gemini-partner-container-element"> <section> <a class="gemini-partner-item gc-analytics-event gemini-reset-link" href="https://colab.research.google.com/github/google/generative-ai-docs/blob/main/site/en/tutorials/quickstart_colab.ipynb" data-category="content_click" data-label="https://colab.research.google.com/github/google/generative-ai-docs/blob/main/site/en/tutorials/quickstart_colab.ipynb" data-action="Colab" target="_blank"> <article class="gemini-item gemini-link gemini-dark"> <div class="gemini-sparks" inert> <span class="gemini-spark"></span> </div> <div class="gemini-content"> <img alt="Partner logo for Colab" src="/static/images/partners/colab.svg"> <div class="gemini-label gemini-type-t3"> <span class="gemini-text">Colab</span> <svg class="gemini-arrow" xmlns="http://www.w3.org/2000/svg" width="8" height="8" fill="none"><path fill="#fff" d="m1.13 7.674 5.266-5.266V7.01c0 .368.302.67.67.67a.664.664 0 0 0 .664-.665V.801a.664.664 0 0 0-.665-.665H.852a.664.664 0 1 0 0 1.33h4.601L.187 6.73a.669.669 0 0 0 0 .943c.26.26.684.26.943 0Z"/></svg> </div> </div> </article> </a> <a class="gemini-partner-item gc-analytics-event gemini-reset-link" href="https://cloud.google.com/products/gemini/code-assist" data-category="content_click" data-label="https://cloud.google.com/products/gemini/code-assist" data-action="Google Cloud" target="_blank"> <article class="gemini-item gemini-link gemini-dark"> <div class="gemini-sparks" inert> <span class="gemini-spark"></span> </div> <div class="gemini-content"> <img alt="Partner logo for Google Cloud" src="/static/images/partners/logo-gcloud.svg"> <div class="gemini-label gemini-type-t3"> <span class="gemini-text">Google Cloud</span> <svg class="gemini-arrow" xmlns="http://www.w3.org/2000/svg" width="8" height="8" fill="none"><path fill="#fff" d="m1.13 7.674 5.266-5.266V7.01c0 .368.302.67.67.67a.664.664 0 0 0 .664-.665V.801a.664.664 0 0 0-.665-.665H.852a.664.664 0 1 0 0 1.33h4.601L.187 6.73a.669.669 0 0 0 0 .943c.26.26.684.26.943 0Z"/></svg> </div> </div> </article> </a> <a class="gemini-partner-item gc-analytics-event gemini-reset-link" href="https://firebase.google.com/products/generative-ai" data-category="content_click" data-label="https://firebase.google.com/products/generative-ai" data-action="Firebase" target="_blank"> <article class="gemini-item gemini-link gemini-dark"> <div class="gemini-sparks" inert> <span class="gemini-spark"></span> </div> <div class="gemini-content"> <img alt="Partner logo for Firebase" src="/static/images/partners/firebase-icon.svg"> <div class="gemini-label gemini-type-t3"> <span class="gemini-text">Firebase</span> <svg class="gemini-arrow" xmlns="http://www.w3.org/2000/svg" width="8" height="8" fill="none"><path fill="#fff" d="m1.13 7.674 5.266-5.266V7.01c0 .368.302.67.67.67a.664.664 0 0 0 .664-.665V.801a.664.664 0 0 0-.665-.665H.852a.664.664 0 1 0 0 1.33h4.601L.187 6.73a.669.669 0 0 0 0 .943c.26.26.684.26.943 0Z"/></svg> </div> </div> </article> </a> <a class="gemini-partner-item gc-analytics-event gemini-reset-link" href="https://developer.android.com/gemini-in-android" data-category="content_click" data-label="https://developer.android.com/gemini-in-android" data-action="Android Studio" target="_blank"> <article class="gemini-item gemini-link gemini-dark"> <div class="gemini-sparks" inert> <span class="gemini-spark"></span> </div> <div class="gemini-content"> <img alt="Partner logo for Android Studio" src="/static/images/partners/android-studio.svg"> <div class="gemini-label gemini-type-t3"> <span class="gemini-text">Android Studio</span> <svg class="gemini-arrow" xmlns="http://www.w3.org/2000/svg" width="8" height="8" fill="none"><path fill="#fff" d="m1.13 7.674 5.266-5.266V7.01c0 .368.302.67.67.67a.664.664 0 0 0 .664-.665V.801a.664.664 0 0 0-.665-.665H.852a.664.664 0 1 0 0 1.33h4.601L.187 6.73a.669.669 0 0 0 0 .943c.26.26.684.26.943 0Z"/></svg> </div> </div> </article> </a> <a class="gemini-partner-item gc-analytics-event gemini-reset-link" href="https://marketplace.visualstudio.com/items?itemName=GoogleCloudTools.cloudcode" data-category="content_click" data-label="https://marketplace.visualstudio.com/items?itemName=GoogleCloudTools.cloudcode" data-action="VS Code" target="_blank"> <article class="gemini-item gemini-link gemini-dark"> <div class="gemini-sparks" inert> <span class="gemini-spark"></span> </div> <div class="gemini-content"> <img alt="Partner logo for Vs Code" src="/static/images/partners/logo-vscode.svg"> <div class="gemini-label gemini-type-t3"> <span class="gemini-text">VS Code</span> <svg class="gemini-arrow" xmlns="http://www.w3.org/2000/svg" width="8" height="8" fill="none"><path fill="#fff" d="m1.13 7.674 5.266-5.266V7.01c0 .368.302.67.67.67a.664.664 0 0 0 .664-.665V.801a.664.664 0 0 0-.665-.665H.852a.664.664 0 1 0 0 1.33h4.601L.187 6.73a.669.669 0 0 0 0 .943c.26.26.684.26.943 0Z"/></svg> </div> </div> </article> </a> <a class="gemini-partner-item gc-analytics-event gemini-reset-link" href="https://plugins.jetbrains.com/plugin/8079-gemini--google-cloud-code" data-category="content_click" data-label="https://plugins.jetbrains.com/plugin/8079-gemini--google-cloud-code" data-action="JetBrains IDEs" target="_blank"> <article class="gemini-item gemini-link gemini-dark"> <div class="gemini-sparks" inert> <span class="gemini-spark"></span> </div> <div class="gemini-content"> <img alt="Partner logo for JetBrains IDEs" src="/static/images/partners/logo-intellij.svg"> <div class="gemini-label gemini-type-t3"> <span class="gemini-text">JetBrains IDEs</span> <svg class="gemini-arrow" xmlns="http://www.w3.org/2000/svg" width="8" height="8" fill="none"><path fill="#fff" d="m1.13 7.674 5.266-5.266V7.01c0 .368.302.67.67.67a.664.664 0 0 0 .664-.665V.801a.664.664 0 0 0-.665-.665H.852a.664.664 0 1 0 0 1.33h4.601L.187 6.73a.669.669 0 0 0 0 .943c.26.26.684.26.943 0Z"/></svg> </div> </div> </article> </a> <a class="gemini-partner-item gc-analytics-event gemini-reset-link" href="https://developers.google.com/idx/guides/code-with-idx-ai" data-category="content_click" data-label="https://developers.google.com/idx/guides/code-with-idx-ai" data-action="Project IDX" target="_blank"> <article class="gemini-item gemini-link gemini-dark"> <div class="gemini-sparks" inert> <span class="gemini-spark"></span> </div> <div class="gemini-content"> <img alt="Partner logo for Project IDX" src="/static/images/partners/idx.svg"> <div class="gemini-label gemini-type-t3"> <span class="gemini-text">Project IDX</span> <svg class="gemini-arrow" xmlns="http://www.w3.org/2000/svg" width="8" height="8" fill="none"><path fill="#fff" d="m1.13 7.674 5.266-5.266V7.01c0 .368.302.67.67.67a.664.664 0 0 0 .664-.665V.801a.664.664 0 0 0-.665-.665H.852a.664.664 0 1 0 0 1.33h4.601L.187 6.73a.669.669 0 0 0 0 .943c.26.26.684.26.943 0Z"/></svg> </div> </div> </article> </a> <a class="gemini-partner-item gc-analytics-event gemini-reset-link" href="https://developer.chrome.com/docs/devtools/console/understand-messages" data-category="content_click" data-label="https://developer.chrome.com/docs/devtools/console/understand-messages" data-action="Chrome DevTools" target="_blank"> <article class="gemini-item gemini-link gemini-dark"> <div class="gemini-sparks" inert> <span class="gemini-spark"></span> </div> <div class="gemini-content"> <img alt="Partner logo for Chrome Devtools" src="/static/images/partners/logo-chrome-devtools.svg"> <div class="gemini-label gemini-type-t3"> <span class="gemini-text">Chrome DevTools</span> <svg class="gemini-arrow" xmlns="http://www.w3.org/2000/svg" width="8" height="8" fill="none"><path fill="#fff" d="m1.13 7.674 5.266-5.266V7.01c0 .368.302.67.67.67a.664.664 0 0 0 .664-.665V.801a.664.664 0 0 0-.665-.665H.852a.664.664 0 1 0 0 1.33h4.601L.187 6.73a.669.669 0 0 0 0 .943c.26.26.684.26.943 0Z"/></svg> </div> </div> </article> </a> </section> </div> </section> </article> </div> </section> </div> </section> <section id="gemma-open-models" class="gemini-space-d180 gemini-section" data-viewport data-section-name="gemma-open-models"> <div class="gemini-layout-max-width"> <div class="gemini-background-wrapper gemini-background-light-blue"> <section class="gemini-gemma-preview" id="gemini-gemma-preview"> <div class="gemini-section-inner gemini-layout-max-width" style="--gemini-section-copy-color: var(--gemini-color-grey-100)"> <div class="gemini-section-cta " style=""> <article class="gemini-cta " data-viewport="once" data-viewport-threshold="0.3" > <div class="gemini-section gemini-section__subtitle"> <div class="gemini-star-logo gemini-space-d32"> <svg class="" viewBox="0 0 140 140" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M139.134 69.6962C132.825 69.6823 126.513 69.6858 120.203 69.6858C119.498 69.6858 119.474 69.6508 119.414 68.9557C119.257 67.1219 119.125 65.2846 118.912 63.4577C118.786 62.3539 118.59 61.2536 118.325 60.1778C117.84 58.2007 117.327 56.2307 116.743 54.2816C116.349 52.9787 115.899 51.6758 115.319 50.4462C114.436 48.5775 113.448 46.7506 112.442 44.9412C110.749 41.8849 108.584 39.1673 106.269 36.565C106.143 36.4253 106.067 36.2471 105.965 36.0865C106.171 35.9956 106.37 35.8839 106.587 35.8245C106.74 35.7861 106.912 35.814 107.076 35.814H112.494C115.612 35.814 118.73 35.814 121.848 35.814C122.4 35.814 122.592 35.6149 122.543 35.1573C122.49 34.6683 122.124 34.7347 121.803 34.7347C116.642 34.7312 111.478 34.7347 106.318 34.7347C105.271 34.7347 105.225 34.6892 105.225 33.6658V18.4502C105.225 18.2476 105.281 18.0066 105.19 17.8599C105.065 17.6538 104.82 17.5211 104.628 17.3569C104.485 17.5316 104.289 17.6887 104.213 17.8878C104.139 18.08 104.188 18.321 104.188 18.5375C104.188 23.3719 104.192 28.2097 104.185 33.044C104.185 33.4073 104.118 33.7671 104.066 34.298C103.766 34.0395 103.623 33.9173 103.472 33.7915C102.163 32.7017 100.861 31.5944 99.5306 30.5256C98.9371 30.047 98.2947 29.6279 97.6488 29.2157C96.1823 28.2761 94.7613 27.2282 93.2076 26.4562C90.9836 25.3489 88.6932 24.3464 86.3574 23.4941C84.301 22.7396 82.1747 22.076 80.0204 21.6952C77.1749 21.1922 74.277 20.9862 71.3966 20.6892C70.405 20.5845 70.398 20.6334 70.398 19.6553V1.09693C70.398 0.876871 70.4469 0.639346 70.3771 0.44723C70.3142 0.262101 70.0908 -0.0208335 69.9895 0.000124537C69.7905 0.0420407 69.574 0.230663 69.4658 0.415793C69.3785 0.569486 69.4379 0.807011 69.4379 1.00961C69.4344 7.24813 69.4344 13.4901 69.4344 19.7287C69.4344 20.5321 69.3506 20.5914 68.579 20.6648C66.2048 20.8988 63.8341 21.1364 61.4634 21.4053C58.6249 21.7267 55.9155 22.579 53.2515 23.564C51.7712 24.1124 50.3082 24.7202 48.8942 25.4153C47.0542 26.32 45.2177 27.2491 43.4755 28.3215C40.9931 29.8514 38.7306 31.6887 36.5589 33.6413C36.3041 33.8684 35.9479 33.9802 35.6372 34.1478C35.5569 33.8125 35.4068 33.4737 35.4068 33.1383C35.3963 28.1957 35.4102 23.2496 35.4068 18.307C35.4068 17.9717 35.5464 17.4582 34.9948 17.4687C34.471 17.4757 34.6317 17.9752 34.6317 18.2895C34.6247 23.288 34.6386 28.2866 34.6351 33.2851C34.6351 34.7975 34.8865 34.8045 33.1303 34.8115C28.1131 34.829 23.0994 34.829 18.0822 34.836C17.9006 34.836 17.6981 34.794 17.5445 34.8604C17.3944 34.9233 17.1884 35.1189 17.2024 35.2342C17.2233 35.3948 17.3944 35.5974 17.5515 35.6708C17.7156 35.7476 17.946 35.6987 18.145 35.6987C22.9597 35.7057 27.7745 35.7127 32.5892 35.7197C32.844 35.7197 33.1094 35.6917 33.3503 35.7476C33.5458 35.793 33.7762 35.9118 33.8775 36.069C33.9264 36.1493 33.7623 36.4148 33.6436 36.551C33.0849 37.2007 32.4739 37.805 31.9537 38.4792C30.9866 39.7297 30.0125 40.9802 29.1431 42.3005C28.1271 43.8409 27.1809 45.4338 26.2836 47.0475C25.6691 48.1513 25.1733 49.325 24.6531 50.4777C24.1887 51.5046 23.7034 52.5246 23.3438 53.5865C22.9318 54.809 22.649 56.0735 22.3103 57.3205C22.1532 57.9143 21.9926 58.5046 21.846 59.1019C21.619 59.9961 21.2978 60.8799 21.207 61.7846C20.9626 64.1982 20.802 66.6154 20.6449 69.0361C20.61 69.5775 20.3866 69.794 19.8768 69.787C19.6603 69.787 19.4404 69.794 19.2204 69.794C13.3653 69.7975 7.51359 69.801 1.65844 69.808C1.22201 69.808 0.782084 69.822 0.349145 69.8709C0.223453 69.8814 0.115218 70.0351 0 70.1259C0.118709 70.2167 0.223453 70.3459 0.356127 70.3844C0.527208 70.4298 0.715746 70.4018 0.900793 70.4018C7.11906 70.4088 13.3373 70.4123 19.5556 70.4228C20.4703 70.4228 20.5891 70.5625 20.6449 71.4497C20.7497 73.0146 20.8719 74.576 21.001 76.1374C21.0674 76.9757 21.1128 77.8175 21.2629 78.6384C21.4305 79.557 21.7063 80.4582 21.9402 81.3629C22.2789 82.6588 22.6211 83.9547 22.9667 85.2471C23.1134 85.792 23.2321 86.3474 23.4451 86.8644C23.9827 88.1638 24.5693 89.4422 25.1314 90.7277C25.306 91.1259 25.4526 91.538 25.6551 91.9223C26.0008 92.5755 26.4128 93.1972 26.7445 93.8574C27.7605 95.8694 29.0034 97.7382 30.3721 99.5231C31.4021 100.861 32.5054 102.139 33.5807 103.442C33.8321 103.743 34.2546 103.98 34.0625 104.455C33.8635 104.951 33.3817 104.794 33.0046 104.794C28.0084 104.805 23.0086 104.798 18.0124 104.808C17.7505 104.811 17.3211 104.619 17.3036 105.115C17.3036 105.192 17.7645 105.36 18.0124 105.36C23.0435 105.377 28.0782 105.37 33.1129 105.374C33.4585 105.374 33.8042 105.381 34.1498 105.388C34.5269 105.398 34.7189 105.594 34.7259 105.971C34.7259 106.191 34.7399 106.408 34.7399 106.628V121.735C34.7399 121.934 34.7259 122.14 34.7643 122.332C34.7853 122.434 34.9075 122.514 34.9808 122.601C35.0786 122.518 35.2322 122.444 35.2601 122.339C35.309 122.151 35.288 121.941 35.288 121.742C35.2915 116.726 35.288 111.707 35.3055 106.691C35.3055 106.436 35.4871 106.181 35.5813 105.926C35.8397 106.027 36.14 106.072 36.3425 106.237C37.1595 106.9 37.9136 107.641 38.7481 108.28C40.3611 109.517 41.9637 110.778 43.6605 111.881C45.0641 112.793 46.5968 113.509 48.0877 114.285C49.1596 114.843 50.2349 115.416 51.3557 115.87C52.6475 116.394 53.9812 116.824 55.315 117.229C56.5195 117.599 57.7415 117.921 58.9705 118.19C60.2973 118.483 61.638 118.756 62.9857 118.92C64.9199 119.157 66.8647 119.287 68.8059 119.458C69.4309 119.514 69.6055 119.678 69.6474 120.303C69.6613 120.558 69.6543 120.813 69.6543 121.068C69.6613 127.125 69.6648 133.182 69.6823 139.239C69.6823 139.511 69.5042 139.986 69.9511 140C70.412 140.011 70.2374 139.532 70.2409 139.263C70.2688 133.318 70.2828 127.369 70.3003 121.421C70.3038 120.967 70.3107 120.509 70.3107 120.055C70.3072 119.646 70.5028 119.493 70.9113 119.454C73.4111 119.213 75.9145 118.972 78.4074 118.679C79.577 118.543 80.7502 118.35 81.8884 118.061C83.0615 117.767 84.1788 117.254 85.3519 116.964C87.541 116.429 89.5416 115.437 91.5527 114.491C93.3194 113.656 95.0127 112.65 96.6677 111.609C98.9615 110.166 101.116 108.525 103.116 106.687C103.378 106.446 103.72 106.289 104.024 106.09C104.097 106.453 104.237 106.816 104.241 107.18C104.258 112.126 104.258 117.068 104.272 122.015C104.272 122.322 104.129 122.828 104.649 122.814C105.131 122.804 105.03 122.315 105.03 121.99C105.065 116.845 105.089 111.7 105.113 106.558C105.117 105.531 105.176 105.468 106.196 105.472C111.321 105.475 116.443 105.479 121.569 105.486C121.75 105.486 121.949 105.528 122.113 105.468C122.267 105.409 122.511 105.22 122.494 105.136C122.448 104.944 122.302 104.742 122.141 104.623C122.03 104.543 121.824 104.588 121.659 104.588C117.026 104.595 112.393 104.602 107.76 104.609C107.324 104.609 106.884 104.633 106.451 104.591C106.266 104.574 105.993 104.448 105.944 104.309C105.896 104.158 106.028 103.907 106.147 103.746C106.395 103.414 106.695 103.121 106.957 102.796C108.022 101.479 109.143 100.201 110.12 98.8245C111.157 97.3609 112.121 95.8345 113.004 94.2696C113.891 92.7082 114.722 91.1014 115.417 89.4492C116.164 87.6748 116.841 85.8584 117.341 84.0036C117.972 81.6493 118.479 79.2566 118.884 76.8534C119.187 75.0615 119.247 73.2312 119.404 71.4148C119.477 70.5835 119.498 70.552 120.361 70.552C126.617 70.552 132.87 70.5555 139.127 70.545C139.462 70.545 139.993 70.7441 140 70.1189C140.003 69.4762 139.462 69.6962 139.134 69.6962ZM21.6679 63.6079C22.0659 61.6483 22.3173 59.6573 22.7433 57.7047C22.9772 56.6359 23.4485 55.6194 23.8012 54.575C23.9967 53.9916 24.1364 53.3839 24.3668 52.8145C24.7194 51.9447 25.1349 51.0994 25.5155 50.2401C25.7075 49.8105 25.8576 49.3599 26.0741 48.9442C26.6188 47.9033 27.1704 46.8624 27.7535 45.8459C28.354 44.8085 28.9231 43.7431 29.6319 42.7826C30.8749 41.1024 32.2086 39.4921 33.5109 37.8574C33.668 37.6583 33.867 37.4976 34.0521 37.3195C34.3314 37.0505 34.5234 37.1763 34.6002 37.4871C34.6561 37.7142 34.6421 37.9587 34.6421 38.1927V52.7446H34.6701V67.1324C34.6701 67.8845 34.3267 68.3852 33.6401 68.6344C33.4865 68.6902 33.3293 68.7496 33.1722 68.7811C32.1248 68.9837 31.0494 69.0954 30.0299 69.3923C27.338 70.1748 24.5972 69.6089 21.8879 69.787C21.3886 69.822 21.2769 69.5286 21.2769 69.0989C21.2769 67.2581 21.3013 65.4278 21.6679 63.6079ZM34.684 102.227C34.684 102.569 34.5304 102.911 34.4501 103.254C34.1743 103.086 33.8321 102.971 33.6331 102.737C32.5647 101.479 31.5103 100.208 30.4978 98.9048C29.8868 98.1189 29.3351 97.284 28.7974 96.4457C28.3121 95.6842 27.8478 94.9053 27.4288 94.1054C26.8038 92.9073 26.2033 91.6882 25.6272 90.4657C25.0791 89.3025 24.5553 88.1324 24.063 86.9482C23.8256 86.3824 23.693 85.7746 23.5079 85.1878C23.2495 84.3844 22.9737 83.581 22.7328 82.7706C22.5408 82.1279 22.3453 81.4817 22.2335 80.8215C22.0205 79.585 21.8879 78.3345 21.6819 77.0979C21.3676 75.2047 21.228 73.3045 21.2734 71.3904C21.2978 70.4717 21.3292 70.4193 22.2231 70.4228C23.9758 70.4228 25.732 70.332 27.4742 70.4577C28.7835 70.552 30.0718 70.9118 31.3637 71.1773C32.1457 71.338 32.9139 71.5615 33.6925 71.7222C34.4955 71.8864 34.6701 72.061 34.6735 72.8888V87.6119H34.6945C34.6945 92.4847 34.698 97.3574 34.684 102.227ZM104.188 36.6977C104.195 46.6947 104.202 56.6883 104.209 66.6853C104.209 66.7761 104.213 66.8669 104.209 66.9577C104.185 67.803 104.08 67.8729 103.294 67.6039C100.672 66.7097 98.162 65.578 95.732 64.2471C93.3787 62.9617 91.1512 61.4981 89.0319 59.8599C86.2911 57.7327 83.7842 55.3609 81.5497 52.7062C79.8145 50.6418 78.1909 48.4936 76.8816 46.1289C75.925 44.3963 74.9125 42.6882 74.0466 40.9103C73.4461 39.6703 73.055 38.3325 72.5662 37.0366C72.4964 36.8514 72.4196 36.6663 72.3358 36.4847C72.1437 36.0725 72.245 35.8769 72.7094 35.8245C72.9433 35.7965 73.1807 35.8035 73.4181 35.8035H88.2428V35.814H103.284C104.15 35.814 104.188 35.8524 104.188 36.6977ZM70.4015 22.3799C70.4015 21.5939 70.5237 21.4857 71.3023 21.545C72.9363 21.6743 74.5773 21.7581 76.2008 21.9572C77.3704 22.1004 78.5226 22.3834 79.6748 22.6314C80.9387 22.9003 82.2201 23.1239 83.449 23.5046C85.1319 24.0251 86.8008 24.6084 88.4209 25.2965C90.2259 26.0615 92.0066 26.8963 93.7279 27.836C95.9764 29.0655 98.1026 30.5046 100.089 32.1324C100.973 32.8554 101.832 33.6029 102.701 34.3399C102.687 34.4238 102.669 34.5111 102.655 34.5949C102.313 34.6403 101.968 34.7242 101.626 34.7242C96.3046 34.7312 90.9801 34.7277 85.6591 34.7312C81.3542 34.7312 77.0527 34.7347 72.7513 34.7381C71.8155 34.7381 71.7806 34.7347 71.5188 33.8544C71.3128 33.1558 71.1347 32.4432 71.016 31.7272C70.7646 30.2252 70.3317 28.7511 70.3841 27.1932C70.4399 25.5899 70.3945 23.9867 70.4015 22.3799ZM37.8508 33.5715C39.3591 32.3734 40.8325 31.1159 42.4246 30.0366C44.0306 28.9467 45.7379 28.0001 47.4487 27.0815C48.772 26.3689 50.1511 25.7436 51.5407 25.1638C53.5867 24.3115 55.6571 23.5186 57.8498 23.0959C59.4942 22.7816 61.1108 22.3135 62.7657 22.0795C64.7279 21.8035 66.718 21.6987 68.6977 21.5346C69.1795 21.4961 69.4204 21.828 69.4169 22.2506C69.3995 25.2372 69.6893 28.2376 68.8478 31.1718C68.6174 31.9752 68.4533 32.796 68.2613 33.6099C68.0413 34.5565 67.8109 34.7416 66.8472 34.7416C62.0535 34.7416 57.2562 34.7416 52.459 34.7416V34.7696C47.735 34.7696 43.0111 34.7731 38.2872 34.7591C37.8612 34.7591 37.2572 34.9757 37.0861 34.4447C37.0233 34.2526 37.54 33.8195 37.8508 33.568V33.5715ZM36.2552 36.0445C36.3215 35.9083 36.51 35.7895 36.6672 35.7511C36.8732 35.6987 37.1001 35.7267 37.3201 35.7267C42.1487 35.7267 46.9809 35.7267 51.8096 35.7267V35.8H66.3026C66.3933 35.8 66.4841 35.8 66.5749 35.8035C67.4547 35.821 67.6188 36.0236 67.2732 36.8305C66.3165 39.0695 65.3983 41.326 64.3404 43.5196C63.1114 46.059 61.5926 48.4412 59.8888 50.6838C58.7017 52.2451 57.3505 53.6773 56.0656 55.1618C55.7514 55.5216 55.4023 55.4797 54.9973 55.071C53.7124 53.7821 52.431 52.4931 51.1462 51.2042C49.1037 49.1538 47.0647 47.1069 45.0187 45.0635C42.5747 42.6219 40.1202 40.1907 37.6727 37.7526C37.2467 37.3265 36.8278 36.8968 36.4228 36.4532C36.325 36.3449 36.2098 36.1354 36.2552 36.048V36.0445ZM35.3998 37.8888C35.3998 37.6339 35.5185 37.3789 35.5848 37.1239C35.8467 37.2531 36.1714 37.323 36.3669 37.5151C39.8933 41.0256 43.4022 44.5535 46.9215 48.071C49.397 50.544 51.8864 53.0031 54.3653 55.4727C54.9135 56.0211 54.9763 56.2411 54.4212 56.7372C52.9722 58.0331 51.4988 59.308 49.9696 60.5061C48.8174 61.4108 47.5884 62.2317 46.342 63.0071C45.1898 63.7232 43.9643 64.324 42.7737 64.9737C42.1836 65.295 41.6145 65.6583 41.0035 65.9308C40.0469 66.3604 39.0623 66.7376 38.0882 67.1289C37.533 67.3489 36.9639 67.5306 36.4158 67.7646C35.6442 68.0999 35.3299 67.9148 35.3299 67.0625C35.323 62.1898 35.3265 57.317 35.3265 52.4477H35.3928C35.3928 47.5924 35.3893 42.7406 35.3998 37.8888ZM35.295 103.652C35.295 98.6324 35.295 93.6164 35.295 88.6004H35.3195V73.6049C35.3195 72.3544 35.4172 72.2671 36.5869 72.6164C37.1525 72.7841 37.6867 73.074 38.2348 73.301C39.0553 73.6398 39.8898 73.9472 40.6928 74.314C41.7158 74.7821 42.7283 75.2781 43.7199 75.802C44.701 76.319 45.6716 76.8534 46.6073 77.4437C48.8209 78.841 51.0275 80.2556 52.9129 82.0894C54.8052 83.9233 56.7255 85.7362 58.4782 87.6957C59.7107 89.0685 60.7302 90.6403 61.7602 92.1773C62.6645 93.5326 63.4954 94.9437 64.2775 96.3724C64.8431 97.4028 65.2865 98.5031 65.7719 99.579C66.2886 100.732 66.7983 101.891 67.2941 103.055C67.4198 103.355 67.5071 103.68 67.542 104.001C67.5839 104.375 67.3989 104.637 67.0008 104.689C66.8402 104.71 66.6727 104.71 66.5086 104.71C56.4811 104.738 46.4537 104.77 36.4228 104.798C35.4242 104.798 35.295 104.665 35.295 103.652ZM69.6474 115.252H69.6509C69.6509 116.185 69.6439 117.114 69.6543 118.043C69.6578 118.57 69.4065 118.839 68.8932 118.825C67.3849 118.773 65.8591 118.986 64.3823 118.515C64.2286 118.466 64.0576 118.462 63.8969 118.434C61.8545 118.106 59.805 117.809 57.7695 117.432C57.0118 117.292 56.2821 116.978 55.5419 116.737C54.5329 116.405 53.5134 116.094 52.5183 115.724C51.621 115.388 50.7412 114.997 49.8648 114.609C49.1386 114.288 48.4124 113.963 47.7141 113.586C46.7784 113.079 45.8741 112.514 44.9489 111.986C44.4461 111.696 43.9049 111.473 43.4266 111.148C42.3582 110.425 41.2968 109.691 40.2808 108.902C39.1635 108.036 38.0917 107.106 37.0128 106.191C36.8801 106.076 36.8208 105.873 36.7265 105.709C36.9151 105.618 37.0931 105.479 37.2921 105.444C37.6308 105.388 37.9799 105.381 38.3256 105.381C47.9026 105.395 57.4762 105.416 67.0497 105.437C67.8597 105.437 68.0937 105.597 68.2927 106.3C68.572 107.292 68.9142 108.277 69.0992 109.286C69.3471 110.662 69.4937 112.056 69.6369 113.446C69.6997 114.044 69.6474 114.651 69.6474 115.252ZM69.7696 98.2656C69.5601 98.0281 69.2877 97.8185 69.1481 97.546C68.5022 96.2886 67.9575 94.9717 67.2522 93.7526C66.1385 91.8175 65.0037 89.8894 63.7328 88.0555C61.5961 84.9782 59.0159 82.2676 56.2507 79.7526C54.7494 78.3834 53.1154 77.1538 51.4779 75.9417C50.3606 75.1104 49.177 74.3559 47.955 73.6818C46.0382 72.6234 44.062 71.6663 42.1173 70.6533C41.9637 70.5695 41.7298 70.325 41.7577 70.2656C41.8694 70.0351 42.037 69.794 42.25 69.6613C42.5852 69.4517 42.9867 69.3539 43.3358 69.1653C45.2875 68.0894 47.2637 67.052 49.17 65.8958C50.6574 64.9946 52.0959 63.9921 53.4785 62.9338C54.704 61.9976 55.8457 60.9497 56.9804 59.9018C58.8693 58.1623 60.6848 56.3389 62.228 54.2885C63.7887 52.2137 65.297 50.0865 66.6622 47.8789C67.7201 46.1673 68.5196 44.302 69.4379 42.5066C69.5182 42.3529 69.6299 42.2237 69.7626 42.0281C69.9162 42.1922 70.0384 42.2761 70.1012 42.3948C70.5098 43.1633 70.8903 43.9492 71.3163 44.7107C72.1577 46.2162 72.9992 47.7252 73.879 49.2097C75.52 51.9727 77.5066 54.4877 79.6818 56.8419C82.0071 59.3639 84.5 61.7217 87.2722 63.7511C89.6359 65.4767 92.0694 67.1044 94.7194 68.3794C95.6028 68.802 96.4686 69.2631 97.3241 69.7382C97.5126 69.8429 97.6976 70.063 97.7395 70.2621C97.7605 70.3634 97.4847 70.573 97.3101 70.6638C95.6307 71.5336 93.9024 72.316 92.2754 73.2696C90.6484 74.2197 89.0982 75.313 87.548 76.3923C84.5733 78.4637 81.9896 80.9857 79.5421 83.6369C77.964 85.3449 76.5046 87.1578 75.2651 89.1349C74.2037 90.829 73.1179 92.5056 72.1088 94.2277C71.5048 95.2581 71.0474 96.3724 70.4853 97.4273C70.3177 97.7451 70.0105 97.9896 69.7696 98.2656ZM102.135 106.53C99.8868 108.521 97.5231 110.365 94.9045 111.85C93.1727 112.831 91.4235 113.792 89.6429 114.683C88.7421 115.137 87.754 115.423 86.8008 115.769C85.8651 116.111 84.9399 116.496 83.9832 116.754C82.3562 117.194 80.7118 117.592 79.0603 117.935C77.6777 118.221 76.2811 118.462 74.8775 118.612C73.5054 118.756 72.1193 118.77 70.7367 118.812C70.3387 118.825 70.3107 118.487 70.3072 118.179C70.3072 117.212 70.3037 116.248 70.3037 115.28C70.3037 114.533 70.3317 113.782 70.3003 113.038C70.2165 111.137 70.6738 109.317 71.0998 107.494C71.222 106.963 71.3652 106.439 71.5118 105.915C71.613 105.566 71.8749 105.44 72.224 105.447C72.5522 105.451 72.8804 105.44 73.2086 105.44H87.2093V105.465C92.0415 105.465 96.8737 105.461 101.702 105.475C102.079 105.475 102.46 105.625 102.837 105.706C102.603 105.982 102.404 106.293 102.135 106.53ZM102.436 104.616C102.17 104.665 101.894 104.665 101.622 104.665C96.8981 104.665 92.1777 104.665 87.4572 104.665V104.7H73.3483C73.1493 104.7 72.9468 104.707 72.7478 104.693C72.252 104.661 71.9727 104.291 72.1577 103.833C72.8106 102.209 73.4565 100.578 74.1723 98.9817C74.7274 97.7416 75.3454 96.5296 76.0053 95.3419C77.2831 93.0366 78.7635 90.8639 80.422 88.8135C81.3018 87.7272 82.2445 86.6863 83.1872 85.6558C83.7214 85.0725 83.9972 85.1144 84.5454 85.6628C87.349 88.4747 90.1596 91.2796 92.9667 94.0879C96.109 97.2351 99.2478 100.382 102.387 103.53C102.488 103.631 102.603 103.725 102.694 103.84C102.973 104.176 102.865 104.529 102.436 104.612V104.616ZM104.234 102.827C104.234 103.18 104.066 103.533 103.975 103.882C103.717 103.676 103.434 103.495 103.2 103.261C101.238 101.315 99.2793 99.3624 97.3241 97.4063C95.498 95.5795 93.679 93.7386 91.853 91.9153C89.5486 89.6134 87.2373 87.3185 84.9259 85.0236C84.507 84.6044 84.4755 84.3075 84.912 83.9338C86.4447 82.6239 87.9321 81.2476 89.5556 80.06C91.3851 78.7222 93.2949 77.4717 95.2606 76.3504C96.9121 75.4108 98.6927 74.6982 100.428 73.9088C101.385 73.4757 102.355 73.0565 103.34 72.6932C104.07 72.4243 104.206 72.5465 104.209 73.329C104.223 76.1024 104.223 78.8759 104.223 81.6493C104.227 83.8569 104.227 86.0645 104.227 88.2721H104.244C104.244 93.1239 104.251 97.9757 104.234 102.827ZM117.637 79.0331C117.061 81.6598 116.384 84.2796 115.501 86.8155C114.743 88.9777 113.898 91.1398 112.651 93.1064C111.709 94.5909 110.937 96.1907 109.939 97.6368C108.807 99.2786 107.509 100.809 106.273 102.384C106.15 102.541 106.004 102.688 105.847 102.807C105.515 103.058 105.194 102.925 105.141 102.513C105.11 102.3 105.124 102.076 105.124 101.86C105.124 97.1164 105.124 92.3764 105.124 87.6329H105.166V73.8494C105.166 73.7027 105.166 73.556 105.169 73.4093C105.19 72.1623 105.34 72.0156 106.566 71.7571C107.917 71.4707 109.251 71.1004 110.602 70.8245C111.346 70.6743 112.114 70.58 112.871 70.5625C114.418 70.5241 115.968 70.5485 117.519 70.5555C118.224 70.5555 118.391 70.7302 118.388 71.4288C118.377 73.9892 118.185 76.5425 117.641 79.0331H117.637ZM117.365 69.6858C116.181 69.6892 114.994 69.6438 113.811 69.6997C111.894 69.787 110.043 69.4447 108.21 68.9417C107.564 68.7601 106.901 68.6274 106.245 68.4877C105.333 68.2886 105.215 68.1523 105.215 67.1917V52.7481H105.225V38.5211C105.225 38.3569 105.197 38.1858 105.236 38.0321C105.281 37.833 105.375 37.6478 105.449 37.4557C105.634 37.5465 105.868 37.5884 105.99 37.7317C106.971 38.8809 107.99 40.0021 108.881 41.2212C109.928 42.6603 110.923 44.1448 111.817 45.6818C112.948 47.6309 114.027 49.6079 114.764 51.7561C115.204 53.0415 115.759 54.2886 116.195 55.574C116.489 56.4333 116.674 57.331 116.894 58.2112C117.079 58.9517 117.232 59.6992 117.421 60.4363C118.109 63.1399 118.294 65.8993 118.381 68.6728C118.409 69.6264 118.346 69.6858 117.365 69.6858Z" fill="white"/> </svg> </div> </div> <div class="gemini-section gemini-section__title"> <h2 class="gemini-type-d4 gemini-space-d24" id="innovate-with-gemma-open-models" data-text="Innovate with Gemma open models" tabindex="-1">Innovate with Gemma open models</h2> </div> <div class="gemini-section gemini-section__copy"> <p class="gemini-type-t1 gemini-space-d48">Accelerate responsible AI development with unprecedented flexibility and access to lightweight, customizable models</p> </div> <div class="gemini-section gemini-section__buttons"> <a class="gemini-btn gemini-secondary gemini-type-btn gc-analytics-event" data-category="content_click" data-label="https://ai.google.dev/gemma" data-action="Learn more" href="/gemma" rel="" > <span>Learn more</span> </a> </div> </article> </div> </div> </section> </div> </div> </section> <section id="community" class="gemini-section" data-viewport data-section-name="community"> <section class="gemini-landing-community gemini-has-ring"> <div class="gemini-layout-max-width gemini-layout-zstack"> <div class="gemini-section-cta gemini-community-cta" style=""> <article class="gemini-cta " data-viewport="once" data-viewport-threshold="0.3" > <div class="gemini-section gemini-section__subtitle"> </div> <div class="gemini-section gemini-section__title"> <h2 class="gemini-type-d4 gemini-space-d32" id="join-the-community" data-text="Join the community" tabindex="-1">Join the community</h2> </div> <div class="gemini-section gemini-section__copy"> <p class="gemini-type-b1 gemini-space-d48">Tap into the power of our community forum. Get answers, build together, and be part of the conversation.</p> </div> <div class="gemini-section gemini-section__buttons"> <a class="gemini-btn gemini-gradient gemini-type-btn gc-analytics-event" data-category="content_click" data-label="https://discuss.ai.google.dev/" data-action="Build with Google AI Forum" href="https://discuss.ai.google.dev/" rel="" > <span>Build with Google AI Forum</span> </a> </div> </article> </div> <div class="gemini-bottom-svg"> <div class="gemini-svg gemini-lottie-lines" data-lottie="/lottie/landing-community-lines.json" data-lottie-name="landing-community"></div> </div> </div> </section> </section> </devsite-gemini-landing-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="Google AI for Developers" 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> </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": "Google AI for Developers", "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="Itu1h9bDDVx6AI/9wUdxeVRNPx8822"> (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,["Cloud__enable_cloud_shell_fte_user_flow","TpcFeatures__enable_mirror_tenant_redirects","Cloud__enable_cloud_dlp_service","Profiles__enable_page_saving","Profiles__enable_profile_collections","Cloud__enable_cloud_facet_chat","Search__enable_suggestions_from_borg","Profiles__enable_completecodelab_endpoint","MiscFeatureFlags__enable_explain_this_code","Search__enable_dynamic_content_confidential_banner","Cloud__enable_free_trial_server_call","Experiments__reqs_query_experiments","MiscFeatureFlags__emergency_css","EngEduTelemetry__enable_engedu_telemetry","OnSwitch__enable","DevPro__enable_developer_subscriptions","Profiles__enable_complete_playlist_endpoint","Cloud__enable_cloudx_experiment_ids","TpcFeatures__enable_required_headers","CloudShell__cloud_code_overflow_menu","MiscFeatureFlags__enable_firebase_utm","Cloud__enable_cloudx_ping","Cloud__enable_legacy_calculator_redirect","Profiles__enable_release_notes_notifications","Concierge__enable_pushui","Profiles__require_profile_eligibility_for_signin","Profiles__enable_public_developer_profiles","Cloud__enable_llm_concierge_chat","Profiles__enable_awarding_url","Analytics__enable_clearcut_logging","Profiles__enable_recognition_badges","BookNav__enable_tenant_cache_key","Cloud__enable_cloud_shell","DevPro__enable_cloud_innovators_plus","MiscFeatureFlags__developers_footer_image","MiscFeatureFlags__enable_view_transitions","CloudShell__cloud_shell_button","Search__enable_page_map","MiscFeatureFlags__developers_footer_dark_image","Profiles__enable_developer_profiles_callout","Search__enable_ai_eligibility_checks","MiscFeatureFlags__enable_project_variables","Profiles__enable_dashboard_curated_recommendations","MiscFeatureFlags__enable_variable_operator"],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],[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>