In general, if you'd like to mask the numbers entered in the Credit card CVV field during checkout for security purposes, you can add the following CSS style to the CVV input field in the Checkout style template:
-webkit-text-security: circle;
For payment providers with default credit card input fields, such as Braintree, the CSS code would look as follows:
input[placeholder="CVV"]{
-webkit-text-security: circle;
}
For PayU India, the CSS code snippet would look like this:
credit-card-cvv[name="cvv"]{
-webkit-text-security: circle;
}
Please note, that for Stripe it's not possible to customize the styling of the input fields. In case you'd like to mask the CVV field for a specific payment provider, please reach out to Piano Support at support@piano.io for further assistance if needed.
After the above code is applied, the user won't see the numbers entered into the CVV field, but they will be masked by a circle.
For example:
You can also set the values disc or square instead of circle if you prefer. More information about this is available here.