Proper way to create an extra element having a same UI as default stripe element.

[thesid01]

I am new to stripe and was struggling to find the proper way to create a style so that it can also be passed on custom elements like Cardholder Name.

var style = {
    base: {
      iconColor: '#666EE8',
      color: '#31325F',
      lineHeight: '40px',
      fontWeight: 300,
      fontFamily: 'Helvetica Neue',
      fontSize: '15px',
      width:'100%',

      '::placeholder': {
        color: '#CFD7E0',
      },
    },
  };

var cardNumberElement = elements.create('cardNumber',{
    style:style,
    showIcon: true,
    placeholder: 'Card Number',
});
var cardExpiryElement = elements.create('cardExpiry',{
    style:style
});
var cardCvcElement = elements.create('cardCvc',{
    style:style
});

I am creating elements as this and want to create a custom element for the cardholder name. with the same style using stripe elements.

[asolove-stripe]

@thesid01 Hi there. Unfortunately, we don't have such a way to do this. We had tried, but people have so many custom CSS frameworks and layout systems, etc., that there wasn't a good generic way to do so. We recommend creating an input and styling it using whatever you normally use to style your website.