> ## Documentation Index
> Fetch the complete documentation index at: https://docs.turnkey.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Overview

export const SquareCard = ({icon, label, className = "", ...props}) => {
  return <a href={props.href} className=" not-prose font-normal group ring-0 ring-transparent overflow-hidden cursor-pointer ">
      <div className={`flex flex-col items-center ${className}`} {...props}>
        <div className="flex items-center p-5 justify-center rounded-lg border border-zinc-950/10 dark:border-white/10 bg-white dark:bg-transparent">
          {icon}
        </div>
        <span className="mt-2 text-sm text-zinc-950/80 dark:text-white/80 font-medium capitalize group-hover:border-zinc-950/10 group-hover:text-primary">
          {label}
        </span>
      </div>
    </a>;
};

export const Logo = ({id, className = "", fill = "", ...props}) => {
  if (id === "react") {
    return <svg xmlns="http://www.w3.org/2000/svg" viewBox="-11.5 -10.23174 23 20.46348" className={className} {...props}>
        <title>React Logo</title>
        <circle cx="0" cy="0" r="2.05" fill="#61dafb" />
        <g stroke="#61dafb" strokeWidth="1" fill="none">
          <ellipse rx="11" ry="4.2" />
          <ellipse rx="11" ry="4.2" transform="rotate(60)" />
          <ellipse rx="11" ry="4.2" transform="rotate(120)" />
        </g>
      </svg>;
  }
  if (id === "react-native") {
    return <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -12.5 256 256" className={className} {...props}>
        <title>React Native Logo</title>
        <path fill="#4e4e4e" d="M121.309004,84.6732585 C123.402504,81.5874152 125.694292,81.1950171 127.553451,81.1950171 C129.41261,81.1950171 132.509843,81.5874152 134.604162,84.6732585 C151.106348,107.339593 178.345607,152.492 198.439108,185.798721 C211.542532,207.519499 221.6069,224.201947 223.671721,226.324944 C231.422996,234.294992 242.053551,229.327949 248.230809,220.287799 C254.312201,211.387762 256.000111,205.138399 256.000111,198.471155 C256.000111,193.930186 167.895315,30.0714244 159.022317,16.4322117 C150.48936,3.31359639 147.710044,0 133.105527,0 L122.176721,0 C107.615631,0 105.511479,3.31359639 96.9777022,16.4322117 C88.1055238,30.0714244 0.0001105152,193.930186 0.0001105152,198.471155 C0.0001105152,205.138399 1.68839227,211.387762 7.76991495,220.287799 C13.9471241,229.327949 24.5775965,234.294992 32.3286259,226.324944 C34.3936934,224.201947 44.4580605,207.519499 57.5616485,185.798721 C77.654822,152.492 104.806818,107.339593 121.309004,84.6732585 Z" />
      </svg>;
  }
  if (id === "android-kotlin") {
    return <svg xmlns="http://www.w3.org/2000/svg" viewBox="-147 -70 294 345" className={className} {...props}>
        <title>Android Kotlin Logo</title>
        <g fill="#a4c639">
          <use stroke="#FFF" strokeWidth="14.4" xlinkHref="#b" />
          <use xlinkHref="#a" transform="scale(-1,1)" />
          <g id="a" stroke="#FFF" strokeWidth="7.2">
            <rect rx="6.5" transform="rotate(29)" height="86" width="13" y="-86" x="14" />
            <rect id="c" rx="24" height="133" width="48" y="41" x="-143" />
            <use y="97" x="85" xlinkHref="#c" />
          </g>
          <g id="b">
            <ellipse cy="41" rx="91" ry="84" />
            <rect rx="22" height="182" width="182" y="20" x="-91" />
          </g>
        </g>
        <g stroke="#FFF" strokeWidth="7.2" fill="#FFF">
          <path d="m-95 44.5h190" />
          <circle cx="-42" r="4" />
          <circle cx="42" r="4" />
        </g>
      </svg>;
  }
  if (id === "ios-swift") {
    return <svg width="60" height="60" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
        <title>iOS Swift Logo</title>
        <path d="M59.3867 16.4501C59.3832 15.8528 59.3766 15.2558 59.3601 14.6578C59.3253 13.357 59.2484 12.0444 59.0172 10.7575C58.7826 9.4506 58.3991 8.2354 57.7947 7.0482C57.2014 5.8823 56.4258 4.8154 55.5006 3.8902C54.5756 2.965 53.5087 2.1895 52.3423 1.5959C51.1561 0.9922 49.9407 0.6088 48.635 0.3742C47.3474 0.1423 46.0348 0.0659 44.733 0.0307C44.1353 0.0145 43.5382 0.0077 42.9407 0.004C42.2315 0 41.5218 0 40.8128 0H25.0912H18.5781C17.8684 0 17.1595 0 16.4505 0.0041C15.8528 0.0078 15.255 0.0146 14.6582 0.0308C14.3328 0.0396 14.0067 0.051 13.6804 0.0667C12.7016 0.1139 11.7213 0.2004 10.7561 0.3743C9.77684 0.5503 8.84824 0.8099 7.94484 1.1834C7.64374 1.3078 7.34534 1.445 7.04874 1.5959C6.17394 2.0411 5.35494 2.5886 4.61004 3.2248C4.36174 3.4369 4.12164 3.6588 3.89044 3.8901C2.96504 4.8153 2.18944 5.8822 1.59614 7.0481C0.991738 8.2353 0.608738 9.4505 0.373938 10.7574C0.142938 12.0443 0.0661381 13.3569 0.0311381 14.6577C0.0147381 15.2557 0.00783811 15.8527 0.00393811 16.45C-0.000561889 17.1594 3.81111e-05 17.8689 3.81111e-05 18.5781V28.26V40.8125C3.81111e-05 41.5224 -0.000661889 42.2312 0.00393811 42.9411C0.00783811 43.5384 0.0147381 44.1354 0.0311381 44.7324C0.0661381 46.0339 0.142838 47.3468 0.373938 48.6331C0.608738 49.9396 0.991738 51.1559 1.59614 52.3428C2.18944 53.509 2.96504 54.5756 3.89044 55.5004C4.81514 56.426 5.88234 57.2014 7.04884 57.7954C8.23514 58.3992 9.45044 58.7821 10.7564 59.0167C12.0432 59.2483 13.3568 59.3253 14.6583 59.3601C15.2551 59.376 15.8529 59.3831 16.4506 59.3865C17.1596 59.3916 17.8685 59.3909 18.5782 59.3909H40.8128C41.5218 59.3909 42.2315 59.3916 42.9406 59.3865C43.5381 59.3831 44.1352 59.376 44.7329 59.3601C46.0347 59.3253 47.3473 59.2482 48.6349 59.0167C49.9406 58.7821 51.156 58.3991 52.3422 57.7954C53.5086 57.2015 54.5755 56.426 55.5005 55.5004C56.4257 54.5755 57.2014 53.509 57.7946 52.3428C58.399 51.1559 58.7825 49.9397 59.0171 48.6331C59.2483 47.3468 59.3252 46.0339 59.36 44.7324C59.3764 44.1354 59.383 43.5385 59.3866 42.9411C59.3912 42.2312 59.3908 41.5224 59.3908 40.8125V18.5781C59.3909 17.8689 59.3912 17.1594 59.3867 16.4501Z" fill="#F05138" />
        <path d="M47.0605 36.6607C47.0591 36.6589 47.0578 36.6576 47.0563 36.6559C47.122 36.4323 47.1898 36.2101 47.2473 35.9809C49.7123 26.16 43.6962 14.549 33.5157 8.43555C37.977 14.4834 39.9496 21.8088 38.197 28.215C38.0407 28.7864 37.8528 29.3348 37.6451 29.8678C37.4197 29.7197 37.1357 29.5516 36.7543 29.3413C36.7543 29.3413 26.6274 23.0886 15.6515 12.0291C15.3635 11.7388 21.5043 20.8061 28.4734 28.169C25.19 26.3263 16.0396 19.6686 10.2468 14.3667C10.9585 15.5536 11.805 16.6965 12.7355 17.7968C17.573 23.9317 23.8817 31.5012 31.4398 37.3137C26.1294 40.5635 18.6257 40.8162 11.1546 37.3171C9.30673 36.4511 7.56953 35.4062 5.96143 34.219C9.12393 39.2775 13.9946 43.6419 19.9227 46.1898C26.9922 49.2279 34.0223 49.0219 39.2583 46.2396L39.2542 46.2456C39.2781 46.2305 39.3085 46.214 39.3333 46.1987C39.5483 46.0831 39.7617 45.9654 39.9704 45.8411C42.4861 44.5353 47.4551 43.2105 50.1222 48.3999C50.7754 49.6699 52.1634 42.9395 47.0605 36.6607Z" fill="white" />
      </svg>;
  }
  if (id === "unity") {
    return <svg width="326" height="368" viewBox="0 0 326 368" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
        <title>Unity Logo</title>
        <path d="M325.729 258.325V86.6778L177.07 0.854004V66.7544L235.308 100.471C237.607 102.003 237.607 105.069 235.308 105.835L166.342 145.682C164.043 147.214 161.744 146.448 160.212 145.682L91.2463 105.835C88.9475 105.069 88.9475 101.237 91.2463 100.471L149.484 66.7544V0.854004L0.0585938 86.6778V258.325L56.7636 225.375V157.942C56.7636 155.643 59.8287 154.111 61.3613 154.877L130.327 194.724C132.626 196.256 133.392 197.789 133.392 200.088V279.781C133.392 282.08 130.327 283.613 128.794 282.846L70.5567 249.13L13.8517 282.08L162.511 368.67L311.17 282.846L254.465 249.896L196.227 283.613C193.928 285.145 191.629 283.613 191.629 280.547V200.854C191.629 198.555 193.162 196.256 194.695 195.49L263.66 155.643C265.959 154.111 268.258 155.643 268.258 158.708V226.141L325.729 258.325Z" fill="#4C4C4C" />
        <path d="M162.511 368.67L311.17 282.846L254.465 249.896L196.227 283.613C193.928 285.145 191.629 283.613 191.629 280.547V200.854C191.629 198.555 193.162 196.256 194.695 195.49L263.66 155.643C265.959 154.111 268.258 155.643 268.258 158.708V226.141L324.963 259.092V86.6777L162.511 180.931L162.511 368.67Z" fill="black" />
        <path d="M177.07 0.854004V66.7544L235.308 100.471C237.607 102.003 237.607 105.069 235.308 105.835L166.342 145.682C164.043 147.214 161.744 146.448 160.212 145.682L91.2463 105.835C88.9475 105.069 88.9475 101.237 91.2463 100.471L149.484 66.7544V0.854004L0.0585938 86.6778L162.511 180.931L324.963 86.6777L177.07 0.854004Z" fill="#808080" />
        <path d="M129.561 283.613L71.323 249.896L14.618 282.846L163.277 368.67V180.931L0.0585938 86.6778V258.325L56.7636 225.375V157.942C56.7636 155.643 59.8287 154.111 61.3613 154.877L130.327 194.724C132.626 196.256 133.392 197.789 133.392 200.088V279.781C134.158 282.846 131.859 285.145 129.561 283.613Z" fill="#4C4C4C" />
      </svg>;
  }
  if (id === "flutter") {
    return <svg width="214" height="264" viewBox="0 0 214 264" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
  <title>Flutter Logo</title>
  <path d="M132.28 0.0900002L213.95 0L76.9301 136.95L41.2201 172.46L0.590088 131.78L132.28 0.0900002ZM131.52 122.37C132.58 120.97 134.53 121.66 136.01 121.48L213.88 121.5L142.91 192.4L102.07 151.81L131.52 122.37Z" fill="#44D1FD" />
  <path d="M61.3601 192.47L102.07 151.81L142.91 192.4L143.08 192.58L102.08 233.2L61.3601 192.47Z" fill="#1FBCFD" />
  <path d="M102.08 233.2L143.08 192.58L213.91 263.48C187.23 263.54 160.56 263.46 133.89 263.52C132.37 263.86 131.43 262.47 130.46 261.61L102.08 233.2Z" fill="#08589C" />
</svg>;
  }
  if (id === "kotlin") {
    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
    <path d="M48 48H0V0H48L23.505 23.6475L48 48Z" fill="url(#paint0_radial_4080_74)" />
    <defs>
      <radialGradient id="paint0_radial_4080_74" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(48 -1.13738e-06) rotate(180) scale(48)">
        <stop stop-color="#E44857" />
        <stop offset="0.504494" stop-color="#C711E1" />
        <stop offset="1" stop-color="#7F52FF" />
      </radialGradient>
    </defs>
    </svg>;
  }
  if (id === "rest-api") {
    return <svg width="609" height="447" viewBox="0 0 609 447" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
        <title>Rest API Logo</title>
        <path d="M47.2 104.2H80.8C90.4 104.2 96.8 105.8 100 109C103.2 112.2 104.8 120.2 104.8 129.8V145.8C104.8 150.6 104.8 155.4 106.4 160.2C106.4 161.8 108 165 108 169.8H146.4V165C143.2 163.4 141.6 160.2 140 155.4C140 152.2 138.4 147.4 138.4 139.4V128.2C138.4 117 136.8 107.4 133.6 102.6C130.4 96.2002 125.6 93.0002 117.6 89.8002C127.2 86.6002 133.6 81.8002 136.8 73.8002C140 65.8002 143.2 57.8002 143.2 49.8002C143.2 43.4002 141.6 37.0002 140 32.2002C138.4 27.4002 135.2 22.6002 132 17.8002C127.2 13.0002 122.4 8.20019 116 6.60019C109.6 3.40019 101.6 1.80017 90.4 1.80017H10.4V168.2H44V104.2H47.2ZM47.2 32.2002H85.6001C92.0001 32.2002 98.4001 33.8002 101.6 35.4002C108 38.6002 111.2 45.0002 111.2 56.2002C111.2 65.8002 108 72.2002 101.6 75.4002C98.4001 77.0002 92.0001 78.6002 85.6001 78.6002H48.8V32.2002H47.2ZM215.2 96.2002H295.2V67.4002H215.2V32.2002H303.2V1.80017H180V169.8H306.4V139.4H215.2V96.2002ZM420 73.8002L391.2 67.4002C380 64.2002 372 62.6002 368.8 61.0002C364 57.8002 360.8 53.0002 360.8 48.2002C360.8 41.8002 364 37.0002 368.8 33.8002C373.6 30.6002 381.6 29.0002 391.2 29.0002C399.2 29.0002 405.6 30.6002 412 33.8002C420 38.6002 424.8 45.0002 424.8 54.6002H458.4C458.4 37.0002 450.4 22.6002 439.2 14.6002C426.4 5.00019 412 0.200195 394.4 0.200195C373.6 0.200195 357.6 5.00019 346.4 14.6002C335.2 24.2002 330.4 37.0002 330.4 51.4002C330.4 67.4002 336.8 80.2002 348 88.2002C354.4 93.0002 367.2 97.8002 384.8 101L402.4 104.2C413.6 105.8 420 109 424.8 112.2C429.6 115.4 432.8 120.2 432.8 125C432.8 134.6 428 141 418.4 144.2C413.6 145.8 405.6 147.4 397.6 147.4C383.2 147.4 373.6 144.2 367.2 137.8C364 134.6 362.4 128.2 360.8 120.2H327.2C327.2 137.8 333.6 150.6 346.4 161.8C359.2 173 376.8 176.2 397.6 176.2C418.4 176.2 436 171.4 447.2 161.8C458.4 152.2 464.8 139.4 464.8 123.4C464.8 109 460 97.8002 450.4 89.8002C442.4 81.8002 432.8 77.0002 420 73.8002ZM474.4 32.2002H524V169.8H559.2V32.2002H608.8V1.80017H474.4V32.2002ZM60 280.2L0.800049 446.6H37.6001L48.8 413H109.6L120.8 446.6H159.2L100 280.2H60ZM58.4 384.2L80.8 318.6L101.6 384.2H58.4ZM252 280.2H180V446.6H215.2V387.4H250.4C268 387.4 282.4 382.6 292 374.6C301.6 366.6 306.4 352.2 306.4 333C306.4 315.4 301.6 301 292 293C280.8 285 268 280.2 252 280.2ZM264.8 352.2C260 355.4 253.6 358.6 245.6 358.6H213.6V309H245.6C253.6 309 260 310.6 264.8 313.8C269.6 317 271.2 323.4 271.2 333C271.2 342.6 269.6 349 264.8 352.2ZM330.4 280.2H365.6V446.6H330.4V280.2Z" fill="#707070" />
      </svg>;
  }
  if (id === 'typescript') {
    return <svg xmlns="http://www.w3.org/2000/svg" fill="none" height="512" viewBox="0 0 512 512" width="512" className={className} {...props}>
          <rect fill="#3178c6" height="512" rx="50" width="512" />
          <rect fill="#3178c6" height="512" rx="50" width="512" />
          <path clip-rule="evenodd" d="m316.939 407.424v50.061c8.138 4.172 17.763 7.3 28.875 9.386s22.823 3.129 35.135 3.129c11.999 0 23.397-1.147 34.196-3.442 10.799-2.294 20.268-6.075 28.406-11.342 8.138-5.266 14.581-12.15 19.328-20.65s7.121-19.007 7.121-31.522c0-9.074-1.356-17.026-4.069-23.857s-6.625-12.906-11.738-18.225c-5.112-5.319-11.242-10.091-18.389-14.315s-15.207-8.213-24.18-11.967c-6.573-2.712-12.468-5.345-17.685-7.9-5.217-2.556-9.651-5.163-13.303-7.822-3.652-2.66-6.469-5.476-8.451-8.448-1.982-2.973-2.974-6.336-2.974-10.091 0-3.441.887-6.544 2.661-9.308s4.278-5.136 7.512-7.118c3.235-1.981 7.199-3.52 11.894-4.615 4.696-1.095 9.912-1.642 15.651-1.642 4.173 0 8.581.313 13.224.938 4.643.626 9.312 1.591 14.008 2.894 4.695 1.304 9.259 2.947 13.694 4.928 4.434 1.982 8.529 4.276 12.285 6.884v-46.776c-7.616-2.92-15.937-5.084-24.962-6.492s-19.381-2.112-31.066-2.112c-11.895 0-23.163 1.278-33.805 3.833s-20.006 6.544-28.093 11.967c-8.086 5.424-14.476 12.333-19.171 20.729-4.695 8.395-7.043 18.433-7.043 30.114 0 14.914 4.304 27.638 12.912 38.172 8.607 10.533 21.675 19.45 39.204 26.751 6.886 2.816 13.303 5.579 19.25 8.291s11.086 5.528 15.415 8.448c4.33 2.92 7.747 6.101 10.252 9.543 2.504 3.441 3.756 7.352 3.756 11.733 0 3.233-.783 6.231-2.348 8.995s-3.939 5.162-7.121 7.196-7.147 3.624-11.894 4.771c-4.748 1.148-10.303 1.721-16.668 1.721-10.851 0-21.597-1.903-32.24-5.71-10.642-3.806-20.502-9.516-29.579-17.13zm-84.159-123.342h64.22v-41.082h-179v41.082h63.906v182.918h50.874z" fill="#fff" fill-rule="evenodd" />
          </svg>;
  }
  if (id === "go") {
    return <svg xmlns="http://www.w3.org/2000/svg" xmlnsXlink="http://www.w3.org/1999/xlink" version="1.1" id="Layer_1" x="0px" y="0px" viewBox="0 0 205.4 76.7" style={{
      enableBackground: "new 0 0 205.4 76.7"
    }} xmlSpace="preserve" className={className} {...props}>
        <title>Go Logo</title>
        <style type="text/css">{`.st0{fill:#00ACD7;}`}</style>
        <g>
          <g>
            <g>
              <g>
                <path className="st0" d="M15.5,23.2c-0.4,0-0.5-0.2-0.3-0.5l2.1-2.7c0.2-0.3,0.7-0.5,1.1-0.5h35.7c0.4,0,0.5,0.3,0.3,0.6l-1.7,2.6      c-0.2,0.3-0.7,0.6-1,0.6L15.5,23.2z" />
              </g>
            </g>
          </g>
        </g>
        <g>
          <g>
            <g>
              <g>
                <path className="st0" d="M0.4,32.4c-0.4,0-0.5-0.2-0.3-0.5l2.1-2.7c0.2-0.3,0.7-0.5,1.1-0.5h45.6c0.4,0,0.6,0.3,0.5,0.6l-0.8,2.4      c-0.1,0.4-0.5,0.6-0.9,0.6L0.4,32.4z" />
              </g>
            </g>
          </g>
        </g>
        <g>
          <g>
            <g>
              <g>
                <path className="st0" d="M24.6,41.6c-0.4,0-0.5-0.3-0.3-0.6l1.4-2.5c0.2-0.3,0.6-0.6,1-0.6h20c0.4,0,0.6,0.3,0.6,0.7L47.1,41      c0,0.4-0.4,0.7-0.7,0.7L24.6,41.6z" />
              </g>
            </g>
          </g>
        </g>
        <g>
          <g id="CXHf1q_3_">
            <g>
              <g>
                <path className="st0" d="M128.4,21.4c-6.3,1.6-10.6,2.8-16.8,4.4c-1.5,0.4-1.6,0.5-2.9-1c-1.5-1.7-2.6-2.8-4.7-3.8       c-6.3-3.1-12.4-2.2-18.1,1.5c-6.8,4.4-10.3,10.9-10.2,19c0.1,8,5.6,14.6,13.5,15.7c6.8,0.9,12.5-1.5,17-6.6       c0.9-1.1,1.7-2.3,2.7-3.7c-3.6,0-8.1,0-19.3,0c-2.1,0-2.6-1.3-1.9-3c1.3-3.1,3.7-8.3,5.1-10.9c0.3-0.6,1-1.6,2.5-1.6       c5.1,0,23.9,0,36.4,0c-0.2,2.7-0.2,5.4-0.6,8.1c-1.1,7.2-3.8,13.8-8.2,19.6c-7.2,9.5-16.6,15.4-28.5,17       c-9.8,1.3-18.9-0.6-26.9-6.6c-7.4-5.6-11.6-13-12.7-22.2c-1.3-10.9,1.9-20.7,8.5-29.3c7.1-9.3,16.5-15.2,28-17.3       c9.4-1.7,18.4-0.6,26.5,4.9c5.3,3.5,9.1,8.3,11.6,14.1C130,20.6,129.6,21.1,128.4,21.4z" />
              </g>
              <g>
                <path className="st0" d="M161.5,76.7c-9.1-0.2-17.4-2.8-24.4-8.8c-5.9-5.1-9.6-11.6-10.8-19.3c-1.8-11.3,1.3-21.3,8.1-30.2       c7.3-9.6,16.1-14.6,28-16.7c10.2-1.8,19.8-0.8,28.5,5.1c7.9,5.4,12.8,12.7,14.1,22.3c1.7,13.5-2.2,24.5-11.5,33.9       c-6.6,6.7-14.7,10.9-24,12.8C166.8,76.3,164.1,76.4,161.5,76.7z M185.3,36.3c-0.1-1.3-0.1-2.3-0.3-3.3       c-1.8-9.9-10.9-15.5-20.4-13.3c-9.3,2.1-15.3,8-17.5,17.4c-1.8,7.8,2,15.7,9.2,18.9c5.5,2.4,11,2.1,16.3-0.6       C180.5,51.3,184.8,44.9,185.3,36.3z" />
              </g>
            </g>
          </g>
        </g>
      </svg>;
  }
  if (id === "rust") {
    return <svg xmlns="http://www.w3.org/2000/svg" xmlnsXlink="http://www.w3.org/1999/xlink" version="1.1" width="300" height="200" viewBox="0 0 300 200" fill="none" className={className} {...props}>
  
      <g clip-path="url(#clip0_1_60)">
      <path d="M149.557 89.5213C119.349 89.5213 91.9026 93.1471 71.5833 99.0556V149.527C91.9026 155.436 119.349 159.062 149.557 159.062C184.132 159.062 215.085 154.312 235.876 146.827V101.757C215.085 94.2709 184.132 89.5213 149.557 89.5213ZM267.016 130.53L263.475 123.207C263.493 122.929 263.508 122.651 263.508 122.371C263.508 114.069 254.86 106.418 240.311 100.292V144.451C247.1 141.593 252.607 138.402 256.546 134.968C255.387 139.621 251.422 149.035 248.261 155.656C243.066 165.125 241.185 173.367 241.426 173.776C241.58 174.033 243.352 171.303 245.965 166.88C252.048 158.228 263.573 141.711 265.876 137.504C268.485 132.734 267.016 130.53 267.016 130.53ZM37.8609 122.855C37.8609 124.454 38.183 126.029 38.8047 127.574L36.6841 131.342C36.6841 131.342 34.9852 133.543 37.9767 138.185C40.6154 142.278 53.8325 158.301 60.8084 166.691C63.8049 170.993 65.8363 173.643 66.0142 173.387C66.2943 172.98 64.1514 164.904 58.2006 155.69C55.4239 150.741 52.1075 144.185 50.1171 139.342C55.6743 142.854 62.945 146.039 71.5833 148.78V96.9315C50.767 103.535 37.8609 112.71 37.8609 122.855Z" fill="#A52B00" />
      <path d="M145.791 12.8178L138.87 24.3578L135.496 24.6525L126.502 14.691C126.098 14.1723 125.552 13.7824 124.929 13.5688C124.307 13.3553 123.636 13.3275 122.998 13.4888C122.365 13.656 121.782 13.9704 121.295 14.4062C120.808 14.842 120.431 15.3869 120.196 15.9961L115.655 28.8365C114.582 29.0709 113.537 29.415 112.534 29.8633L101.814 21.7495C100.811 21.0829 99.2789 20.8397 98.1871 21.3121C97.5824 21.5999 97.0529 22.0238 96.6403 22.5507C96.2276 23.0775 95.9431 23.6927 95.8092 24.348L93.5997 37.9276L90.7157 39.4993L78.8963 33.9326C78.3091 33.611 77.6395 33.4704 76.9723 33.5287C76.3051 33.587 75.6702 33.8414 75.1478 34.26C74.0725 34.9195 73.4375 36.2948 73.3649 37.6209L73.8122 51.3456L71.3522 53.4459L58.6215 50.4098C57.2603 49.9631 55.9811 50.4519 54.9386 51.4857C54.4896 51.9727 54.1644 52.5602 53.9903 53.1988C53.8162 53.8374 53.7983 54.5084 53.9381 55.1554L56.993 68.4637C56.2644 69.3003 55.5847 70.1781 54.9571 71.0926L41.6897 70.5545C41.0333 70.5063 40.3771 70.65 39.8013 70.9682C39.2254 71.2864 38.7549 71.7652 38.4473 72.3461C37.796 73.5342 37.5523 75.0638 38.2294 76.3245L43.6552 88.6716L42.0269 91.642L29.1929 93.8942C28.529 93.9814 27.9003 94.2439 27.3719 94.6546C26.8435 95.0653 26.4345 95.6094 26.1871 96.2307C25.9676 96.8735 25.8849 97.555 25.9442 98.2316C26.0035 98.9082 26.2035 99.565 26.5314 100.16L34.2954 111.172L34.1572 111.749L12.3781 134.768C12.3781 134.768 9.20124 137.308 13.8985 143.497C18.1389 148.783 40.0229 170.063 51.5845 181.308C54.0496 184.603 56.9114 187.582 60.1052 190.18C60.6183 189.569 57.8258 179.255 48.2766 167.268C40.9039 156.411 31.3197 139.713 33.4212 137.833C33.4212 137.833 35.9702 134.593 41.2416 132.247C41.0378 132.077 41.0378 132.077 41.2416 132.247C41.2416 132.247 149.678 182.168 250.19 133.04C261.712 130.903 268.674 137.082 268.674 137.082C271.071 138.57 264.83 155.707 259.783 167.083C252.79 179.949 251.784 190.03 252.38 190.355C254.96 187.377 257.146 184.081 258.886 180.548C267.819 168.267 284.455 144.754 287.541 139.017C291.123 132.482 287.553 130.531 287.553 130.531L264.343 113.515L263.755 111.116L271.287 100.088C272.142 99.0705 272.198 97.5573 271.709 96.2802C271.482 95.6688 271.099 95.1269 270.599 94.7078C270.099 94.2887 269.498 94.0068 268.855 93.8898L255.815 91.635L254.428 88.7394L259.751 76.2077C260.064 75.5853 260.198 74.8882 260.137 74.1943C260.076 73.5004 259.824 72.8371 259.407 72.2784C258.746 71.2048 257.556 70.5546 256.244 70.6692L243.059 71.0666L240.939 68.4237L243.931 55.1528C244.074 54.5102 244.068 53.8434 243.914 53.2034C243.76 52.5633 243.461 51.9669 243.04 51.4597C242.591 50.946 242.01 50.5642 241.359 50.3553C240.709 50.1463 240.013 50.1182 239.348 50.2739L226.596 53.4616C225.733 52.764 224.911 52.0174 224.134 51.2256L224.453 37.6226C224.463 36.9635 224.322 36.3108 224.041 35.7144C223.759 35.1181 223.345 34.5939 222.829 34.1821C222.292 33.7678 221.643 33.5241 220.966 33.4824C220.289 33.4406 219.615 33.6029 219.031 33.9482L207.242 39.5029L204.267 37.8774L202.149 24.4872C202.062 23.8243 201.799 23.1967 201.388 22.6692C200.976 22.1417 200.431 21.7334 199.809 21.4863C199.222 21.1647 198.552 21.0242 197.885 21.0825C197.218 21.1407 196.583 21.3952 196.06 21.8137L185.422 29.7191L182.324 28.8583L177.803 16.0552C177.585 15.4164 177.207 14.844 176.705 14.3927C176.202 13.9414 175.592 13.6264 174.933 13.4777C174.265 13.3557 173.576 13.4079 172.934 13.6291C172.292 13.8503 171.717 14.2332 171.266 14.7407L162.324 24.7604L159.072 24.2902L152.212 12.8226C151.901 12.241 151.442 11.7516 150.881 11.4034C150.32 11.0553 149.677 10.8607 149.017 10.8391C147.688 10.7666 146.442 11.6297 145.791 12.8178Z" fill="url(#paint0_linear_1_60)" />
      <path d="M112.926 162.529C112.511 162.176 112.294 161.966 112.294 161.966L147.811 159.062C118.839 120.906 95.6291 151.301 93.1587 154.7V162.529H112.926ZM186.876 162.118C187.291 161.765 187.508 161.555 187.508 161.555L153.377 159.062C182.362 119.339 204.174 150.89 206.644 154.288V162.118H186.876Z" fill="black" />
      <path d="M241.473 124.234C241.473 124.234 237.611 139.655 213.443 155.873L206.718 157.468C206.718 157.468 184.813 117.587 153.787 162.52C153.787 162.52 163.441 156.936 189.341 163.783C189.341 163.783 177.423 181.995 153.454 181.397C153.454 181.397 176.424 208.981 211.445 169.167C211.445 169.167 248.464 154.876 251.46 124.234H241.473Z" fill="url(#paint1_linear_1_60)" />
      <path d="M169.503 104.468C169.503 104.468 180.338 92.6234 191.174 104.468C191.174 104.468 199.688 120.261 191.174 128.157C191.174 128.157 177.242 139.213 169.503 128.157C169.503 128.157 160.215 119.471 169.503 104.468Z" fill="black" />
      <path d="M182.047 108.862C182.047 113.474 179.324 117.213 175.966 117.213C172.607 117.213 169.884 113.474 169.884 108.862C169.884 104.25 172.607 100.51 175.966 100.51C179.324 100.51 182.047 104.25 182.047 108.862Z" fill="white" />
      <path d="M121.141 101.233C121.141 101.233 139.728 93.0177 144.801 111.355C144.801 111.355 150.115 132.729 129.538 133.936C129.538 133.936 103.298 128.89 121.141 101.233Z" fill="black" />
      <path d="M130.477 109.164C130.477 113.92 127.668 117.778 124.204 117.778C120.741 117.778 117.933 113.92 117.933 109.164C117.933 104.407 120.741 100.551 124.204 100.551C127.668 100.551 130.477 104.407 130.477 109.164Z" fill="white" />
      <path d="M93.2686 171.601C127.216 215.064 143.296 180.163 143.296 180.163C124.238 178.022 110.719 165.358 110.719 165.358C133.588 162.445 146.81 162.207 146.81 162.207C116.198 121.895 91.3628 158.402 91.3628 158.402C85.169 156.142 78.7965 147.521 74.0916 139.554L55.0932 133.965C76.9502 171.066 93.2686 171.601 93.2686 171.601Z" fill="url(#paint2_linear_1_60)" />
      </g>
      <defs>
      <linearGradient id="paint0_linear_1_60" x1="155.668" y1="198.802" x2="139.325" y2="11.6856" gradientUnits="userSpaceOnUse">
      <stop stop-color="#F74C00" />
      <stop offset="0.33" stop-color="#F74C00" />
      <stop offset="1" stop-color="#F49600" />
      </linearGradient>
      <linearGradient id="paint1_linear_1_60" x1="202.457" y1="190.703" x2="202.457" y2="124.234" gradientUnits="userSpaceOnUse">
      <stop stop-color="#CC3A00" />
      <stop offset="0.15" stop-color="#CC3A00" />
      <stop offset="0.74" stop-color="#F74C00" />
      <stop offset="1" stop-color="#F74C00" />
      </linearGradient>
      <linearGradient id="paint2_linear_1_60" x1="100.951" y1="193.421" x2="100.951" y2="133.965" gradientUnits="userSpaceOnUse">
      <stop stop-color="#CC3A00" />
      <stop offset="0.15" stop-color="#CC3A00" />
      <stop offset="0.74" stop-color="#F74C00" />
      <stop offset="1" stop-color="#F74C00" />
      </linearGradient>
      <clipPath id="clip0_1_60">
      <rect width="299" height="199" fill="white" transform="translate(0.719086 0.602844)" />
      </clipPath>
      </defs>
    </svg>;
  }
  if (id === "python") {
    return <svg width="112" height="113" viewBox="0 0 112 113" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
        <title>Python Logo</title>
        <path d="M55.5247 0.410099C50.9411 0.431397 46.5638 0.822317 42.7122 1.50385C31.366 3.50835 29.306 7.70395 29.306 15.4413V25.6601H56.1185V29.0663H29.306H19.2435C11.451 29.0663 4.62773 33.7501 2.49349 42.6601C0.0316724 52.8731 -0.0775229 59.2461 2.49349 69.9101C4.39942 77.8479 8.95104 83.5038 16.7435 83.5038H25.9622V71.2538C25.9622 62.4039 33.6194 54.5976 42.7122 54.5976H69.4935C76.9484 54.5976 82.8997 48.4594 82.8997 40.9726V15.4413C82.8997 8.17501 76.7698 2.71657 69.4935 1.50385C64.8875 0.737124 60.1084 0.388801 55.5247 0.410099Z" fill="url(#paint0_linear_1445_68)" />
        <path d="M86.2434 29.0664V40.9727C86.2434 50.2034 78.4175 57.9727 69.4934 57.9727H42.7122C35.3763 57.9727 29.3059 64.2511 29.3059 71.5977V97.1289C29.3059 104.395 35.6245 108.669 42.7122 110.754C51.1995 113.25 59.3384 113.701 69.4934 110.754C76.2436 108.8 82.8997 104.866 82.8997 97.1289V86.9102H56.1184V83.5039H82.8997H96.3059C104.098 83.5039 107.002 78.0685 109.712 69.9102C112.511 61.5113 112.392 53.4344 109.712 42.6602C107.786 34.9027 104.108 29.0664 96.3059 29.0664Z" fill="url(#paint1_linear_1445_68)" />
        <defs>
          <linearGradient id="paint0_linear_1445_68" x1="0.605957" y1="0.409179" x2="62.4326" y2="53.0941" gradientUnits="userSpaceOnUse">
            <stop stopColor="#5A9FD4" />
            <stop offset="1" stopColor="#306998" />
          </linearGradient>
          <linearGradient id="paint1_linear_1445_68" x1="70.5366" y1="97.9573" x2="48.3555" y2="66.875" gradientUnits="userSpaceOnUse">
            <stop stopColor="#FFD43B" />
            <stop offset="1" stopColor="#FFE873" />
          </linearGradient>
        </defs>
      </svg>;
  }
  if (id === 'ruby') {
    return <svg width="125" height="120" viewBox="0 0 125 120" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
        <path fill-rule="evenodd" clip-rule="evenodd" d="M34.0031 107.33C61.4691 111.08 88.4471 114.763 115.961 118.518C106.587 102.912 97.4541 87.705 88.2481 72.374L34.0031 107.33ZM123.713 20.947C121.292 24.583 118.866 28.216 116.448 31.854C108.144 44.347 99.8411 56.84 91.5451 69.339C91.0831 70.035 90.4841 70.587 91.1351 71.66C99.1511 84.897 107.104 98.173 115.077 111.437C116.335 113.532 117.607 115.619 119.234 117.629C120.846 85.436 122.457 53.242 124.068 21.049L123.713 20.947ZM14.2841 62.22C14.6591 62.575 15.5951 62.782 16.0311 62.567C23.7201 58.788 31.4581 55.093 38.9791 51.003C41.4321 49.67 43.3181 47.28 45.4311 45.342C52.4281 38.925 59.4141 32.495 66.3971 26.064C66.8241 25.669 67.3301 25.287 67.5851 24.789C70.0931 19.887 72.5581 14.96 75.1101 9.89102C72.0671 8.74701 69.1821 7.62801 66.2611 6.61001C65.8651 6.47201 65.2411 6.74601 64.8121 6.98501C58.0511 10.762 51.1631 14.338 44.6171 18.457C41.3421 20.518 38.6741 23.555 35.7741 26.2C31.1001 30.466 26.4321 34.742 21.8261 39.082C20.6041 40.234 19.4901 41.55 18.5381 42.936C15.3881 47.523 12.3321 52.176 9.13612 56.961C10.9221 58.808 12.5461 60.574 14.2841 62.22ZM42.3861 55.949C38.5611 72.108 34.7591 88.176 30.8301 104.772C49.2531 92.901 67.2511 81.304 85.1301 69.785C70.9021 65.18 56.7201 60.589 42.3861 55.949ZM119.017 21.103C103.451 23.704 88.2571 26.242 72.8671 28.813C78.1091 41.564 83.2461 54.059 88.5291 66.909C98.7501 51.55 108.769 36.499 119.017 21.103ZM43.0281 52.644C57.0451 57.194 70.7831 61.654 84.9201 66.244C79.6701 53.454 74.6001 41.111 69.4251 28.507C60.6101 36.566 51.9271 44.506 43.0281 52.644ZM14.8631 71.643C9.89212 83.526 5.09012 95.005 0.201117 106.691C9.59712 106.413 18.7051 106.144 28.1261 105.866C23.7031 94.454 19.3671 83.266 14.8631 71.643ZM28.4561 97.739L28.8021 97.663C32.1551 83.722 35.5561 69.877 38.9791 55.391C31.3431 59.36 24.0591 63.145 16.5761 67.035C20.3951 76.961 24.4671 87.432 28.4561 97.739ZM113.383 18.842C108.924 17.661 104.465 16.476 100.004 15.303C93.5921 13.617 87.1751 11.952 80.7671 10.251C79.9661 10.038 79.3871 9.89902 78.9161 10.864C76.6511 15.504 74.3161 20.109 72.0151 24.732C71.9441 24.875 71.9591 25.06 71.9041 25.419C85.7901 23.315 99.5831 21.224 113.374 19.134L113.383 18.842ZM87.5141 8.28802L123.857 18.342C121.773 12.403 119.84 6.89602 117.852 1.23202L87.5671 7.94701L87.5141 8.28802ZM31.5371 110.007C27.0361 109.488 22.4151 109.965 17.8501 110.044C14.1001 110.107 10.3501 110.25 6.60012 110.367C6.21412 110.379 5.82912 110.457 5.44412 110.873C36.4471 113.739 67.4491 116.605 98.4511 119.473L98.5141 119.059C88.5761 117.702 78.6371 116.345 68.6991 114.989C56.3151 113.298 43.9521 111.438 31.5371 110.007ZM0.814117 95.994C4.80912 86.724 8.78712 77.448 12.7981 68.185C13.1991 67.256 13.1681 66.625 12.3831 65.877C10.7051 64.28 9.14612 62.559 7.31212 60.651C4.83312 72.891 2.41512 84.828 -0.00488281 96.764L0.266117 96.891C0.451117 96.594 0.677117 96.313 0.814117 95.994ZM79.5541 5.84101C86.2911 4.10301 93.1261 2.74402 99.9211 1.22802C100.361 1.12902 100.791 0.984015 101.224 0.860015L101.157 0.528015C91.5861 1.81502 82.0161 3.10302 71.9631 4.45602C74.7041 5.65302 76.8161 6.54701 79.5541 5.84101Z" fill="#D91404" />
      </svg>;
  }
  return null;
};

With Embedded Wallets, you can create custom wallet experiences that are seamlessly integrated into your product, without compromising on security. Whether you need custodial or non-custodial wallets, our infrastructure provides the foundation for building innovative, user-friendly crypto products.

### Why embedded wallets?

Embedded Wallets give you the freedom to design and control the entire user experience, while offloading the complexity and risk of private key management to Turnkey.

With Embedded Wallets, you can:

* Leverage pre-built UI components to speed up your integration
* Easily create a variety of wallets for your users
* Authenticate users via email, phone number, biometrics, social logins, etc
* Determine delegated access and co-owernership controls
* Access out-of-the-box support for multiple chains and assets
* Sign multiple transactions without additional approvals
* Access simple integrations for gas sponsorship and smart contract wallets

### Custodial vs non-custodial

Turnkey's Embedded Wallets are built on top of Sub-Organizations.
Each wallet is represented by a sub-organization, which can be configured with different security settings and access controls.

* For custodial wallets, your application holds the master key and can initiate transactions on behalf of users.
* For non-custodial wallets, users hold their own private keys and must approve each transaction,
  using one of their configured [authentication](/authentication/overview) methods.

Below, we'll dive into how we set each of these up but first, let's make sure you're familiar with
the Embedded Wallets concepts and architecture.

### Embedded wallets quickstart

Head over to the [Getting Started](/sdks/react/getting-started) guide to set up your React app with `@turnkey/react-wallet-kit`.

Looking for more support? Check out our Demos, SDKs and Code Examples below!

## Demos

### Demo embedded wallet ([code](https://github.com/tkhq/demo-embedded-wallet))

A comprehensive demo showcasing how to build an embedded wallet using Turnkey. This demo uses the [`@turnkey/sdk-browser`](https://www.npmjs.com/package/@turnkey/sdk-browser), [`@turnkey/sdk-react`](https://www.npmjs.com/package/@turnkey/sdk-react) and [`@turnkey/sdk-server`](https://www.npmjs.com/package/@turnkey/sdk-server) packages and includes features such as:

* User authentication with passkeys, email auth, and OAuth
* Creating new wallets and wallet accounts
* Sending and receiving funds
* Importing/Exporting a wallet
* Adding a credential to the wallet

<CardGroup>
  <Frame>
    <img src="https://mintcdn.com/turnkey-0e7c1f5b/83HCB8zBjOP3rX5S/images/getting-started/demo-embedded-wallet.png?fit=max&auto=format&n=83HCB8zBjOP3rX5S&q=85&s=be15f67bdffe8b32bd6e0387e2391420" alt="demo embedded wallet login view" width="3024" height="1648" data-path="images/getting-started/demo-embedded-wallet.png" />
  </Frame>

  <Frame>
    <img src="https://mintcdn.com/turnkey-0e7c1f5b/83HCB8zBjOP3rX5S/images/getting-started/demo-embedded-wallet-ui.png?fit=max&auto=format&n=83HCB8zBjOP3rX5S&q=85&s=8695efa0ba1eb607b7e1e431bf7de9aa" alt="demo embedded wallet dashboard view" width="3024" height="1658" data-path="images/getting-started/demo-embedded-wallet-ui.png" />
  </Frame>
</CardGroup>

See [https://github.com/tkhq/demo-embedded-wallet](https://github.com/tkhq/demo-embedded-wallet) for the code.

### Demo consumer wallet ([code](https://github.com/tkhq/demo-consumer-wallet))

A minimal consumer wallet app powered by Turnkey. Behind the scenes, it uses [`@turnkey/ethers`](https://www.npmjs.com/package/@turnkey/ethers) for signing and WalletConnect (v1) for accessing dapps.

<Frame>
  <video src="https://github.com/tkhq/demo-consumer-wallet/assets/127255904/2c3409df-2d7c-4ec3-9aa8-e2944a0b0e0a" width="100%" height="420" controls />
</Frame>

See [https://github.com/tkhq/demo-consumer-wallet](https://github.com/tkhq/demo-consumer-wallet) for the code.

### Demo embedded wallet ([code](https://github.com/tkhq/demo-embedded-wallet), [live link](https://wallet.tx.xyz))

A wallet application showing how users can register and authenticate using passkeys. This demo uses the Turnkey API to create a new [Turnkey Sub-Organization](/concepts/sub-organizations) for each user, create a testnet Ethereum address and send a transaction on Sepolia (ETH testnet).

<Frame>
  <img src="https://mintcdn.com/turnkey-0e7c1f5b/83HCB8zBjOP3rX5S/images/getting-started/demo-embedded-wallet.png?fit=max&auto=format&n=83HCB8zBjOP3rX5S&q=85&s=be15f67bdffe8b32bd6e0387e2391420" alt="demo embedded wallet screenshot" width="3024" height="1648" data-path="images/getting-started/demo-embedded-wallet.png" />
</Frame>

See [https://wallet.tx.xyz](https://wallet.tx.xyz) (and [https://github.com/tkhq/demo-embedded-wallet](https://github.com/tkhq/demo-embedded-wallet) for the code).

### Demo Ethers passkeys ([code](https://github.com/tkhq/demo-ethers-passkeys))

A simple application demonstrating how to create sub-organizations, create private keys, and sign with the [`@turnkey/ethers`](https://github.com/tkhq/sdk/tree/main/packages/ethers) signer, using passkeys.

<Frame>
  <img src="https://mintcdn.com/turnkey-0e7c1f5b/83HCB8zBjOP3rX5S/images/getting-started/ethers-ui-screenshot.png?fit=max&auto=format&n=83HCB8zBjOP3rX5S&q=85&s=d7be656396addaac145001d7e1109f10" alt="ethers ui screenshot" width="5448" height="1606" data-path="images/getting-started/ethers-ui-screenshot.png" />
</Frame>

See [https://github.com/tkhq/demo-ethers-passkeys](https://github.com/tkhq/demo-ethers-passkeys) for the code.

### Demo Viem passkeys ([code](https://github.com/tkhq/demo-viem-passkeys))

A similar, simple application demonstrating how to create sub-organizations, create private keys, and sign with the [`@turnkey/viem`](https://github.com/tkhq/sdk/tree/main/packages/viem) signer, using passkeys.

<Frame>
  <img src="https://mintcdn.com/turnkey-0e7c1f5b/5sbBAG4Yfd-9P7Ds/images/getting-started/viem-ui-screenshot.png?fit=max&auto=format&n=5sbBAG4Yfd-9P7Ds&q=85&s=a57e98f38c947c04d6993ae0805fd59c" alt="viem ui screenshot" width="3000" height="827" data-path="images/getting-started/viem-ui-screenshot.png" />
</Frame>

See [https://github.com/tkhq/demo-viem-passkeys](https://github.com/tkhq/demo-viem-passkeys) for the code.

### Demo Viem passkeys with Gelato relay ([code](https://github.com/gelatodigital/gelato-turnkey-passkeys-relay))

This example demonstrates how to leverage Turnkey’s secure key management and Gelato's battle-tested relay infrastructure to enable seamless, sponsored interactions with meta-transactions using the [`@turnkey/viem`](https://github.com/tkhq/sdk/tree/main/packages/viem) signer and [`@gelatonetwork/relay-sdk-viem`](https://github.com/gelatodigital/relay-sdk-viem).

<Frame>
  <div style={{ width: "50%" }}>
    <img src="https://mintcdn.com/turnkey-0e7c1f5b/83HCB8zBjOP3rX5S/images/getting-started/gelato_turnkey.png?fit=max&auto=format&n=83HCB8zBjOP3rX5S&q=85&s=0311db1f6d24cb36525d548472e17e23" alt="gelato turnkey screenshot" width="599" height="826" data-path="images/getting-started/gelato_turnkey.png" />
  </div>
</Frame>

#### How Infinex leverages Turnkey and Gelato

Infinex, a platform designed to unify the decentralized ecosystem and applications under a single UX layer, eliminates the complexities of navigating fragmented crypto protocols. By integrating **Turnkey** and **Gelato**, Infinex delivers a seamless, secure, and cost-efficient experience for decentralized finance users.

* **Secure Key Management with Turnkey**: Infinex ensures private keys are securely managed within Turnkey’s infrastructure, removing the need for traditional wallet pop-ups. This approach streamlines authentication through passkeys, offering a frictionless and secure user experience.

* **Gasless Transactions with Gelato**: Leveraging Gelato’s Relay (ERC-2771), Infinex enables fully **sponsored transactions**, allowing users to interact with decentralized applications without ever paying gas fees. This enhances accessibility and usability, ensuring that users can participate without holding or managing native blockchain tokens for fees.

The synergy between Turnkey and Gelato allows Infinex to offer an intuitive, cost-free user experience while maintaining the highest standards of security and scalability.

### React Native demo app ([code](https://github.com/tkhq/react-native-demo-wallet))

A React Native app that demonstrates how to use the Turnkey's JavaScript packages in a mobile environment to authenticate users, create wallets, export wallets, sign messages, and more

<Frame>
  <video controls className="rounded-lg" src="https://github.com/tkhq/react-native-demo-wallet/raw/refs/heads/main/assets/videos/demo_video.mov" width="50%" height="260" />
</Frame>

See [https://github.com/tkhq/react-native-demo-wallet](https://github.com/tkhq/react-native-demo-wallet)
for the code.

### Flutter demo app ([code](https://github.com/tkhq/dart-sdk/tree/main/examples/flutter-demo-app))

A Flutter app that demonstrates how to use the Turnkey's Flutter packages to authenticate users, create wallets, export wallets, sign messages, and more

<Frame>
  <video className="rounded-lg" src="https://github.com/tkhq/dart-sdk/raw/refs/heads/main/examples/flutter-demo-app/assets/videos/flutter-demo.mov" width="40%" height="auto" controls />
</Frame>

See [https://github.com/tkhq/dart-sdk/tree/main/examples/flutter-demo-app](https://github.com/tkhq/dart-sdk/tree/main/examples/flutter-demo-app)
for the code

### SDKs

<div className="flex gap-4 items-center justify-center">
  <SquareCard icon={<Logo id="react" className="h-8 w-8" />} label="React" href="/sdks/react" />

  <SquareCard icon={<Logo id="react-native" className="h-8 w-8" />} label="React Native" href="/sdks/react-native" />

  <SquareCard icon={<Logo id="ios-swift" className="h-8 w-8" />} label="iOS (Swift)" href="/sdks/swift" />

  <SquareCard icon={<Logo id="flutter" className="h-8 w-8" />} label="Flutter" href="/sdks/flutter" />

  <SquareCard icon={<Logo id="typescript" className="h-8 w-8" />} label="Typescript" href="/sdks/javascript-browser" />

  <SquareCard icon={<Logo id="kotlin" className="h-8 w-8" />} label="Kotlin" href="/sdks/kotlin" />
</div>

### Next steps

Learn more about our powerful features [here](/embedded-wallets/features/overview).
