diff --git a/app/PaymentDrivers/Stripe/BrowserPay.php b/app/PaymentDrivers/Stripe/BrowserPay.php
index f14e87321341..044472cd422b 100644
--- a/app/PaymentDrivers/Stripe/BrowserPay.php
+++ b/app/PaymentDrivers/Stripe/BrowserPay.php
@@ -18,6 +18,7 @@ use App\Http\Requests\ClientPortal\Payments\PaymentResponseRequest;
 use App\PaymentDrivers\StripePaymentDriver;
 use App\Utils\Ninja;
 use Illuminate\Http\RedirectResponse;
+use Illuminate\View\View;
 use Stripe\ApplePayDomain;
 use Stripe\Exception\ApiErrorException;
 
@@ -56,9 +57,35 @@ class BrowserPay implements MethodInterface
         return redirect()->route('client.payment_methods.index');
     }
 
-    public function paymentView(array $data) {}
+    public function paymentView(array $data): View
+    {
+        $payment_intent_data = [
+            'amount' => $this->stripe->convertToStripeAmount($data['total']['amount_with_fee'], $this->stripe->client->currency()->precision, $this->stripe->client->currency()),
+            'currency' => $this->stripe->client->getCurrencyCode(),
+            'customer' => $this->stripe->findOrCreateCustomer(),
+            'description' => $this->stripe->decodeUnicodeString(ctrans('texts.invoices') . ': ' . collect($data['invoices'])->pluck('invoice_number')),
+        ];
 
-    public function paymentResponse(PaymentResponseRequest $request) { }
+        $data['gateway'] = $this->stripe;
+        $data['pi_client_secret'] = $this->stripe->createPaymentIntent($payment_intent_data)->client_secret;
+
+        $data['payment_request_data'] = [
+            'country' => $this->stripe->client->country->iso_3166_2,
+            'currency' => strtolower(
+                $this->stripe->client->getCurrencyCode()
+            ),
+            'total' => [
+                'label' => $payment_intent_data['description'],
+                'amount' => $payment_intent_data['amount'],
+            ],
+            'requestPayerName' => true,
+            'requestPayerEmail' => true
+        ];
+
+        return render('gateways.stripe.browser_pay.pay', $data);   
+    }
+
+    public function paymentResponse(PaymentResponseRequest $request) {}
 
     /**
      * Ensure Apple Pay domain is verified.
diff --git a/resources/views/portal/ninja2020/gateways/stripe/browser_pay/pay.blade.php b/resources/views/portal/ninja2020/gateways/stripe/browser_pay/pay.blade.php
new file mode 100644
index 000000000000..baf36493f058
--- /dev/null
+++ b/resources/views/portal/ninja2020/gateways/stripe/browser_pay/pay.blade.php
@@ -0,0 +1,37 @@
+@extends('portal.ninja2020.layout.payments', ['gateway_title' => ctrans('texts.browser_pay'), 'card_title' => ctrans('texts.browser_pay')])
+
+@section('gateway_head')
+    @if($gateway->company_gateway->getConfigField('account_id'))
+        <meta name="stripe-account-id" content="{{ $gateway->company_gateway->getConfigField('account_id') }}">
+        <meta name="stripe-publishable-key" content="{{ config('ninja.ninja_stripe_publishable_key') }}">
+    @else
+        <meta name="stripe-publishable-key" content="{{ $gateway->getPublishableKey() }}">
+    @endif
+
+    <meta name="stripe-pi-client-secret" content="{{ $pi_client_secret }}">
+    <meta name="no-available-methods" content="{{ json_encode(ctrans('texts.no_available_methods')) }}">
+    <meta name="payment-request-data" content="{{ json_encode($payment_request_data) }}">
+@endsection
+
+@section('gateway_content')
+    <form action="{{ route('client.payments.response') }}" method="post" id="server-response">
+        @csrf
+        <input type="hidden" name="gateway_response">
+        <input type="hidden" name="payment_hash" value="{{ $payment_hash }}">
+        <input type="hidden" name="company_gateway_id" value="{{ $gateway->getCompanyGatewayId() }}">
+        <input type="hidden" name="payment_method_id" value="{{ $payment_method_id }}">
+    </form>
+
+    <div class="alert alert-failure mb-4" hidden id="errors"></div>
+
+    @include('portal.ninja2020.gateways.includes.payment_details')
+
+    @component('portal.ninja2020.components.general.card-element-single')
+        <div id="payment-request-button"></div>
+    @endcomponent
+@endsection
+
+@section('gateway_footer')
+    <script src="https://js.stripe.com/v3/"></script>
+    <script src="{{ asset('js/clients/payments/stripe-browserpay.js') }}"></script>
+@endsection
\ No newline at end of file