Credit Card

Display

3D flip card displaying number, holder name, expiry and CVV faces.

Instalação via CLI

$ npx kikitocn add credit-card

Exemplo de uso

Credit CardExample.tsx

import { CreditCard } from "@/components/ui/cn/credit-card/CreditCard";

export function CreditCardExample() {
  return (
    <CreditCard />
  );
}

Props

Prop	Tipo	Padrão	Descrição
`number`	`string`	—	Número do cartão (mascarado)
`name`	`string`	—	Nome do titular
`expiry`	`string`	—	Data de validade (MM/YY)
`cvv`	`string`	—	Código de segurança
`brand`	`'visa' \| 'mastercard' \| 'amex' \| 'generic'`	`'generic'`	Bandeira do cartão
`variant`	`'dark' \| 'light' \| 'gradient'`	`'dark'`	Estilo visual
`showBack`	`boolean`	`false`	Exibir o verso do cartão (CVV)
`className`	`string`	—	Classes CSS extras

Carregando…