app_showcase.svg

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="252" height="506.349" viewBox="0 0 252 506.349">
  <defs>
    <linearGradient id="linear-gradient" x1="1.003" y1="-0.001" x2="-0.015" y2="1.014" gradientUnits="objectBoundingBox">
      <stop offset="0" stop-color="#a52eff"/>
      <stop offset="0.498" stop-color="#6747f8"/>
      <stop offset="0.647" stop-color="#6049f7"/>
      <stop offset="0.863" stop-color="#4c51f4"/>
      <stop offset="1" stop-color="#3d58f3"/>
    </linearGradient>
  </defs>
  <g id="Group_434" data-name="Group 434" transform="translate(-856 -193.407)">
    <g id="black-mockup">
      <g id="phone">
        <path id="body" d="M893.594,699.756a35.244,35.244,0,0,1-35.244-35.244V380.2a2.35,2.35,0,0,1-2.35-2.349h0v-31.72a2.349,2.349,0,0,1,2.35-2.349v-9.4a2.35,2.35,0,0,1-2.35-2.349v-31.72a2.349,2.349,0,0,1,2.349-2.35h0v-17.62A2.35,2.35,0,0,1,856,278V263.9a2.349,2.349,0,0,1,2.349-2.35h0v-32.9a35.245,35.245,0,0,1,35.244-35.245h176.812a35.244,35.244,0,0,1,35.244,35.244V310.3a2.35,2.35,0,0,1,2.35,2.349h0v52.866a2.35,2.35,0,0,1-2.35,2.35h0V664.511a35.243,35.243,0,0,1-35.243,35.245H893.594Z" fill="#fff"/>
        <path id="camera" d="M1005.79,213.379a3.525,3.525,0,0,1,7.049,0h0a3.525,3.525,0,0,1-3.525,3.524h0a3.524,3.524,0,0,1-3.524-3.524ZM968.2,215.141a1.763,1.763,0,0,1-1.763-1.762h0a1.763,1.763,0,0,1,1.763-1.762H995.8a1.762,1.762,0,0,1,0,3.524Z" fill="#dcdce9"/>
      </g>
    </g>
    <g id="Group_433" data-name="Group 433">
      <path id="Intersection_4" data-name="Intersection 4" d="M894.487,684.82a22.859,22.859,0,0,1-6.8-1.03q-.744-.258-1.473-.566a23.471,23.471,0,0,1-14.349-21.649V231.589a23.477,23.477,0,0,1,23.5-23.5h22.322a2.935,2.935,0,0,1,2.936,2.887v1.815a12.912,12.912,0,0,0,12.924,12.923h98.1a11.737,11.737,0,0,0,11.744-11.747v-2.936a2.943,2.943,0,0,1,2.935-2.938h22.327a23.51,23.51,0,0,1,22.542,16.845,22.909,22.909,0,0,1,.731,5.751V661.968a22.852,22.852,0,0,1-22.852,22.852Z" fill="url(#linear-gradient)"/>
      <g id="Group_429" data-name="Group 429">
        <g id="Rectangle_69" data-name="Rectangle 69">
          <path id="Path_1" data-name="Path 1" d="M899.3,501.279h-7.216A2.381,2.381,0,0,1,889.7,498.9v-7.217a2.381,2.381,0,0,1,2.378-2.378H899.3a2.38,2.38,0,0,1,2.378,2.378V498.9A2.38,2.38,0,0,1,899.3,501.279Zm-7.216-10.825a1.232,1.232,0,0,0-1.23,1.23V498.9a1.231,1.231,0,0,0,1.23,1.229H899.3a1.231,1.231,0,0,0,1.23-1.229v-7.217a1.232,1.232,0,0,0-1.23-1.23Z" fill="#eff2fb"/>
        </g>
        <g id="Keep_me_signed" data-name="Keep me signed" style="isolation: isolate">
          <text id="Keep_me_signed-2" data-name="Keep me signed" transform="translate(907.718 498.299)" fill="#eff2fb" font-size="8.419" font-family="Montserrat-Regular, Montserrat" style="isolation: isolate"><tspan x="0" y="0">Keep me signed</tspan></text>
        </g>
      </g>
      <g id="Group_430" data-name="Group 430">
        <g id="Group_1" data-name="Group 1">
          <path id="Rectangle_70-3" data-name="Rectangle 70-3" d="M899,515.739h165.375a16.537,16.537,0,0,1,16.537,16.537h0a16.537,16.537,0,0,1-16.537,16.538H899a16.538,16.538,0,0,1-16.538-16.538h0A16.537,16.537,0,0,1,899,515.739Z" fill="#fb9400"/>
        </g>
        <g id="Get_to_App" data-name="Get to App" style="isolation: isolate">
          <text id="Get_to_App-2" data-name="Get to App" transform="translate(952.219 536.185)" fill="#fff" font-size="10.825" font-family="Montserrat-SemiBold, Montserrat" font-weight="600" style="isolation: isolate"><tspan x="0" y="0">Get to App</tspan></text>
        </g>
      </g>
      <g id="Create_account" data-name="Create account" style="isolation: isolate">
        <text id="Create_account-2" data-name="Create account" transform="translate(882.46 576.477)" fill="#fff" font-size="8.419" font-family="Montserrat-Medium, Montserrat" font-weight="500" style="isolation: isolate"><tspan x="0" y="0">Create account</tspan></text>
      </g>
      <g id="Need_Help_" data-name="Need Help " style="isolation: isolate">
        <text id="Need_Help_2" data-name="Need Help?" transform="translate(1031.255 576.477)" fill="#fff" font-size="8.419" font-family="Montserrat-Medium, Montserrat" font-weight="500" style="isolation: isolate"><tspan x="0" y="0">Need Help?</tspan></text>
      </g>
      <g id="Status_Bar" data-name="Status Bar">
        <g id="Battery">
          <g id="Border" opacity="0.35">
            <rect id="Rectangle_1" data-name="Rectangle 1" width="13.23" height="6.815" rx="1.604" transform="translate(1071.89 218.865)" fill="none"/>
            <rect id="Rectangle_2" data-name="Rectangle 2" width="12.629" height="6.214" rx="1.303" transform="translate(1072.191 219.166)" fill="none" stroke="#fff" stroke-miterlimit="10" stroke-width="0.191"/>
          </g>
          <path id="Cap" d="M1085.721,221.07v2.406a1.305,1.305,0,0,0,0-2.406" fill="#fff" opacity="0.4" style="isolation: isolate"/>
          <rect id="Capacity" width="10.825" height="4.41" rx="0.802" transform="translate(1073.093 220.068)" fill="#fff"/>
        </g>
        <path id="Wifi" d="M1064.271,225.458a.185.185,0,0,1-.133-.056l-1.2-1.212a.187.187,0,0,1,0-.266l.009-.008a2.056,2.056,0,0,1,2.657,0,.185.185,0,0,1,.06.136.187.187,0,0,1-.056.138l-1.2,1.212A.185.185,0,0,1,1064.271,225.458Zm2.11-2.127a.189.189,0,0,1-.129-.052,2.947,2.947,0,0,0-3.96,0,.186.186,0,0,1-.261,0l-.694-.7a.194.194,0,0,1,0-.274l0,0a4.3,4.3,0,0,1,5.865,0,.2.2,0,0,1,.06.138.194.194,0,0,1-.057.138l-.693.7A.184.184,0,0,1,1066.381,223.331Zm1.6-1.615a.18.18,0,0,1-.128-.052,5.2,5.2,0,0,0-7.161,0,.18.18,0,0,1-.128.052.189.189,0,0,1-.133-.055l-.692-.7a.193.193,0,0,1,0-.274h0a6.554,6.554,0,0,1,9.069,0,.2.2,0,0,1,.06.137.194.194,0,0,1-.057.138l-.7.7A.181.181,0,0,1,1067.977,221.716Z" fill="#fff"/>
        <path id="Cellular_Connection" data-name="Cellular Connection" d="M1056.054,225.48h-.6a.6.6,0,0,1-.6-.6v-5.212a.6.6,0,0,1,.6-.6h.6a.6.6,0,0,1,.6.6v5.212A.6.6,0,0,1,1056.054,225.48Zm-2.806,0h-.6a.6.6,0,0,1-.6-.6v-3.808a.6.6,0,0,1,.6-.6h.6a.6.6,0,0,1,.6.6v3.808a.6.6,0,0,1-.6.6Zm-2.807,0h-.6a.6.6,0,0,1-.6-.6v-2.4a.6.6,0,0,1,.6-.6h.6a.6.6,0,0,1,.6.6v2.4a.6.6,0,0,1-.6.6Zm-2.806,0h-.6a.6.6,0,0,1-.6-.6v-1.2a.6.6,0,0,1,.6-.6h.6a.6.6,0,0,1,.6.6v1.2A.6.6,0,0,1,1047.635,225.48Z" fill="#fff"/>
        <g id="Time_Style" data-name="Time Style">
          <g id="_Time" data-name=" Time" style="isolation: isolate">
            <text id="_9:41" data-name="9:41" transform="translate(890.683 226.681)" fill="#fff" font-size="9.02" font-family="SegoeUI-Semibold, Segoe UI" font-weight="600" style="isolation: isolate"><tspan x="0" y="0">9:41</tspan></text>
          </g>
        </g>
      </g>
      <g id="Group_431" data-name="Group 431">
        <path id="Path_210" data-name="Path 210" d="M899,444.778h165.375a16.537,16.537,0,0,1,0,33.075H899a16.537,16.537,0,1,1,0-33.075Z" fill="#fff" opacity="0.2" style="isolation: isolate"/>
        <g id="Password" style="isolation: isolate">
          <text id="Password-2" data-name="Password" transform="translate(929.968 465.225)" fill="#eff2fb" font-size="10.825" font-family="Montserrat-Regular, Montserrat" style="isolation: isolate"><tspan x="0" y="0">Password</tspan></text>
        </g>
        <path id="Path_28" data-name="Path 28" d="M914.866,460.793a.886.886,0,0,0-.651-.269h-.306v-1.837a4.122,4.122,0,0,0-1.263-3.024,4.252,4.252,0,0,0-6.012-.036l-.036.036a4.121,4.121,0,0,0-1.263,3.024v1.838h-.306a.914.914,0,0,0-.919.91v5.521a.914.914,0,0,0,.91.919h9.2a.915.915,0,0,0,.919-.911v-5.521A.887.887,0,0,0,914.866,460.793Zm-2.8-.269h-4.9v-1.837a2.363,2.363,0,0,1,.718-1.732,2.45,2.45,0,0,1,3.464,0h0a2.364,2.364,0,0,1,.718,1.732Z" fill="#eff2fb"/>
      </g>
      <g id="Group_432" data-name="Group 432">
        <path id="Path_209" data-name="Path 209" d="M899,398.473h165.375a16.538,16.538,0,0,1,0,33.075H899a16.538,16.538,0,1,1,0-33.075Z" fill="#fff" opacity="0.2" style="isolation: isolate"/>
        <g id="Username" style="isolation: isolate">
          <text id="Username-2" data-name="Username" transform="translate(929.968 418.918)" fill="#eff2fb" font-size="10.825" font-family="Montserrat-Regular, Montserrat" style="isolation: isolate"><tspan x="0" y="0">Username</tspan></text>
        </g>
        <g id="user-shape">
          <g id="Group_96" data-name="Group 96">
            <path id="Path_29" data-name="Path 29" d="M908.719,415.037a3.171,3.171,0,0,0,2.243-5.413,3.171,3.171,0,0,0-4.483,0h0a3.171,3.171,0,0,0,2.241,5.413Z" fill="#eff2fb"/>
            <path id="Path_30" data-name="Path 30" d="M914.5,418.386a8.526,8.526,0,0,0-.116-.9,6.84,6.84,0,0,0-.219-.9,4.316,4.316,0,0,0-.354-.806,2.894,2.894,0,0,0-.513-.667,2.147,2.147,0,0,0-.706-.442,2.472,2.472,0,0,0-.92-.165,1,1,0,0,0-.347.18q-.273.182-.616.4a3.883,3.883,0,0,1-.891.4,3.508,3.508,0,0,1-2.205,0,3.891,3.891,0,0,1-.892-.4q-.342-.219-.615-.4a1.018,1.018,0,0,0-.347-.18,2.477,2.477,0,0,0-.921.165,2.158,2.158,0,0,0-.706.442,2.946,2.946,0,0,0-.512.668,4.313,4.313,0,0,0-.354.806,6.88,6.88,0,0,0-.219.9,8.249,8.249,0,0,0-.116.9q-.028.417-.029.854a2.06,2.06,0,0,0,.6,1.564,2.228,2.228,0,0,0,1.6.574h7.216a2.227,2.227,0,0,0,1.6-.574,2.061,2.061,0,0,0,.6-1.564C914.531,418.949,914.523,418.663,914.5,418.386Z" fill="#eff2fb"/>
          </g>
        </g>
      </g>
      <path id="Path_160" data-name="Path 160" d="M-2861.052,77.2c-1.709,0-2.9-.385-3.542-1.145a4.635,4.635,0,0,1-.823-3.363,205.552,205.552,0,0,1,2.505-21,208.2,208.2,0,0,1,4.722-21.217,3.735,3.735,0,0,1,2-2.5,9.26,9.26,0,0,1,3.935-.715,6.945,6.945,0,0,1,3.274.608,1.974,1.974,0,0,1,1.091,1.825,7.392,7.392,0,0,1-.429,2.29,126.823,126.823,0,0,0-3.721,15.135,182.323,182.323,0,0,0-2.648,18.211c2.274.19,4.152.287,5.582.287,6.647,0,11.595-.975,14.705-2.9s4.687-4.415,4.687-7.406a6.57,6.57,0,0,0-2.683-5.3c-1.781-1.425-4.8-2.219-8.98-2.362a2.8,2.8,0,0,1-2-.715,3.1,3.1,0,0,1-.572-2.075,5.986,5.986,0,0,1,.859-3.364,3.672,3.672,0,0,1,3.148-1.359,32.264,32.264,0,0,0,9.2-1.5,15.562,15.562,0,0,0,6.476-3.828,8.107,8.107,0,0,0,2.361-5.76c0-2.754-1.373-4.957-4.079-6.548-2.349-1.38-5.835-2.172-10.363-2.355l8.84-7.469a24.894,24.894,0,0,1,9.824,3.634,15.046,15.046,0,0,1,4.777,5.063,13.186,13.186,0,0,1,1.592,6.458,14.865,14.865,0,0,1-1.073,5.662,15.134,15.134,0,0,1-3.22,4.821,19.81,19.81,0,0,1-5.277,3.784,32.644,32.644,0,0,1-7.246,2.549,12.932,12.932,0,0,1,6.727,3.971,9.666,9.666,0,0,1,2.289,6.333,15.484,15.484,0,0,1-.885,5.277,14.62,14.62,0,0,1-2.656,4.526,18.493,18.493,0,0,1-4.356,3.676A28.3,28.3,0,0,1-2833,71.153a52.631,52.631,0,0,1-16.386,2.254c-2.377,0-4.3-.072-5.725-.214a3.461,3.461,0,0,1-1.717,3.005A8.056,8.056,0,0,1-2861.052,77.2Zm-8.3-48.8a2.331,2.331,0,0,1-1.968-.895,3.635,3.635,0,0,1-.68-2.254,6.032,6.032,0,0,1,.751-3.077,10.079,10.079,0,0,1,3.614-2.933,53.486,53.486,0,0,1,14.1-5.367,71.219,71.219,0,0,1,16.53-1.932c.81,0,1.611.013,2.382.039L-2826.3,0l8.128,4.781-9.337,7.889a51.917,51.917,0,0,0-7.115-.692l-5.66,8.145c.59-.018,1.188-.027,1.775-.027.742,0,1.468.014,2.159.042l-9.55,8.069h0l5.617-8.083a55.548,55.548,0,0,0-13.037,1.941,49,49,0,0,0-12.165,4.973A8.053,8.053,0,0,1-2869.352,28.4Z" transform="translate(3823.076 283.407)" fill="#fff"/>
    </g>
  </g>
</svg>