CreditCardForm is iOS framework that allows developers to create the UI which replicates an actual Credit Card.
Clone or download
Latest commit e22ed43 Dec 4, 2018
Type Name Latest commit message Commit time
Failed to load latest commit information.
CreditCardForm.xcodeproj Swift 4.2 Nov 29, 2018
CreditCardForm Swift 4.2 Nov 29, 2018
CreditCardFormTests Release 0.0.8 Dec 23, 2016
Example bug fixes Nov 29, 2018
.gitignore gitignore new file Sep 19, 2017
.swift-version Swift 4.2 Nov 29, 2018
.travis.yml bug fixes Nov 29, 2018
CreditCardForm.h created CreditCardForm framework Nov 30, 2016
CreditCardForm.podspec Swift 4.2 Nov 29, 2018
Info.plist Release 0.0.8 Dec 23, 2016
LICENSE Bug fixed Mar 17, 2017 Update Dec 4, 2018


CI Status CocoaPods compatible Carthage compatible Swift 4.2 compatible Platform iOS License: MIT Donate

CreditCardForm is iOS framework that allows developers to create the UI which replicates an actual Credit Card.

Fixed typo use CreditCardForm instead CreditCardForum



To run the example project, clone the repo, and run pod install from the Demo-* directory first.

Supported Cards

  • MasterCard
  • Visa
  • JCB
  • Diners
  • Discover
  • Amex
  • UnionPay


  • Xcode 8
  • iOS 8.1+


Using CocoaPods

CreditCardForm is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod "CreditCardForm"

Using Carthage

CreditCardForm is available through Carthage. To install it, simply add the following line to your Cartfile:

github "orazz/CreditCardForm-iOS"


If you prefer not to use either of the aforementioned dependency managers, you can integrate CreditCardForm into your project manually.

  1. Download and drop CreditCardForm in your project.
  2. Done!

Usage example

First step: this framework integrated with Stripe, you must install Stripe


Create a view set a class CreditCardFormView (preferred frame size: 300x200).
Following this you will have to go through a few simple steps outlined below in order to get everything up and running.

import Stripe
import CreditCardForm


@IBOutlet weak var creditCardForm: CreditCardFormView!

// Stripe textField
let paymentTextField = STPPaymentCardTextField()

Add the following code in the viewDidLoad function in your view controller

// Set up stripe textfield
paymentTextField.frame = CGRect(x: 15, y: 199, width: self.view.frame.size.width - 30, height: 44)
paymentTextField.translatesAutoresizingMaskIntoConstraints = false
paymentTextField.borderWidth = 0

let border = CALayer()
let width = CGFloat(1.0)
border.borderColor = UIColor.darkGray.cgColor
border.frame = CGRect(x: 0, y: paymentTextField.frame.size.height - width, width:  paymentTextField.frame.size.width, height: paymentTextField.frame.size.height)
border.borderWidth = width
paymentTextField.layer.masksToBounds = true


paymentTextField.topAnchor.constraint(equalTo: creditCardForm.bottomAnchor, constant: 20),
paymentTextField.centerXAnchor.constraint(equalTo: view.centerXAnchor),
paymentTextField.widthAnchor.constraint(equalToConstant: self.view.frame.size.width-20),
paymentTextField.heightAnchor.constraint(equalToConstant: 44)

Delegate Methods

In order to use the delegate methods first set the delegate of Stripe to the parent view controller when setting it up

paymentTextField.delegate = self

After that you will be able to set up the following delegate methods inside of your parent view controller

func paymentCardTextFieldDidChange(_ textField: STPPaymentCardTextField) {
creditCardForm.paymentCardTextFieldDidChange(cardNumber: textField.cardNumber, expirationYear: textField.expirationYear, expirationMonth: textField.expirationMonth, cvc: textField.cvc)

func paymentCardTextFieldDidEndEditingExpiration(_ textField: STPPaymentCardTextField) {
creditCardForm.paymentCardTextFieldDidEndEditingExpiration(expirationYear: textField.expirationYear)

func paymentCardTextFieldDidBeginEditingCVC(_ textField: STPPaymentCardTextField) {

func paymentCardTextFieldDidEndEditingCVC(_ textField: STPPaymentCardTextField) {

You should now be ready to use CreditCardForm!!


1) Colors

creditCardForm.backgroundColor (UIColor)
creditCardForm.cardHolderExpireDateColor (UIColor)
creditCardForm.cardHolderExpireDateTextColor (UIColor)
creditCardForm.backLineColor (UIColor)

// Brands Color brand name, front color, back color
[String: [UIColor]]
creditCardForm.colors[Brands.Visa.rawValue] = [,]
creditCardForm.colors[Brands.MasterCard.rawValue] = [,]

2) Images

creditCardForm.chipImage (UIImage)

3) Placeholders

creditCardForm.cardHolderString (String)
creditCardForm.expireDatePlaceholderText (String)

Card number: Configuring the Mask Field

creditCardForm.cardNumberMaskExpression (String)
creditCardForm.cardNumberMaskTemplate (String)

creditCardForm.cardNumberFontSize (CGFloat)


We would love for you to contribute to CreditCardForm, check the LICENSE file for more info.


Oraz Atakishiyev,

3rd party libraries



CreditCardForm is available under the MIT license. See the LICENSE file for more info.