This is my First time that I am integrating Stripe.js in angular project. I have gone through documentation and implement it (Stripe Card Element Method). Stripe implemented and showing me card element in one input field. I don't required single input field, I am looking for pre built themes for stripe element. I added Appearance and client secret but does not picking the theme.

payment-component.ts

import { Component, OnInit } from '@angular/core';
import { FormGroup, FormControl, Validators } from '@angular/forms';

@Component({
  selector: 'app-payment',
  templateUrl: './payment.component.html',
  styleUrls: ['./payment.component.css']
})
export class PaymentComponent implements OnInit {

  constructor() {
   

   }
  
  ngOnInit(): void {
    const clientSecret = 'seti_1KawGlBBpoL4ww8PpzEwfTAU_secret_LHVHt3qcV8Cznw8b00vvFUVaaCFbLnc';
    const appearance = {
      theme: 'flat'
};
    var stripe   = Stripe('pk_test_51JkpiuBBpoL4ww8PpO2UfKSTE7M84aESVyaKUCWBqkxwQ3LRgOpQ2fh7hH4hxb2V9sA3e8DwvVIWoHurhryqdAHp00HVNutZkg');
    var elements = stripe.elements({ clientSecret, appearance});
    var cardElement = elements.create('card');
    cardElement.mount('#card-element');
    
  }

}

payment-component.html

<form action="/charge" method="post" id="payment-form">
  <div class="form-row">
    <label for="card-element">Credit or debit card</label>
    <div id="card-element"></div>
    <div id="card-errors" role="alert"></div>
  </div>
  <button>Add payment source</button>
</form>

Output I got Stripe Output

Theme I required looks alike Theme output