{"repo":"JuandaGarcia/crd-ui","free":true,"listed":false,"github":"https://github.com/JuandaGarcia/crd-ui","clone":"git clone https://github.com/JuandaGarcia/crd-ui.git","description":"A credit & debit card component. Dependency-free, themeable, localizable. One package for React, Vue, Svelte and vanilla JS.","language":"TypeScript","stars":13,"topics":["card","checkout","component-library","credit-card","debit-card","payment","payment-form","react","stripe","svelte"],"license":"MIT","category":"auth-billing-email","readme_excerpt":"crd-ui Framework-agnostic credit/debit card visualization for your payment forms. One package: a zero-dependency vanilla core, with framework adapters as subpaths. - crd-ui — the vanilla core: brand detection, formatting and the card renderer. - crd-ui/react — React component ( ). - crd-ui/vue — Vue 3 component ( ). - crd-ui/svelte — Svelte 5 component ( ). - crd-ui/styles.css — the stylesheet ( crd-ui/styles.layer.css for a cascade-layered build). Features - 💳 Realistic card preview: formatted/masked number, name, expiry, CVC. - 🔄 Choreographed 3D flip when the CVC is focused: the card lifts off with a wrist-flick tilt, spring-settles past 180°, and a light sheen sweeps the face ( prefers-reduced-motion aware). - 🎯 Magic focus ring: one highlight travels between sections, sliding and morphing to fit each one with a spring settle. - 🪩 Optional 3D hover tilt ( tilt ): the card follows the pointer with a cursor-tracked glare (hover-only — flattened on touch devices and under prefers-reduced-motion ). - 🪪 Two layouts: 'form' (payment-form preview, default) and 'display' for presenting a card the user owns — dashboards, saved cards, with click-to-reveal. - 🏷 Live brand detection while typing: Visa, Mastercard, Amex, Discover, Diners Club, JCB, UnionPay, Maestro, Elo, Hipercard. - ✨ Six built-in finishes via variant — the default sunset tints its color bloom to the detected brand. - 🎨 Themeable via CSS custom properties; per-brand gradients out of the box. - 🌍 Localizable ","default_branch":null,"files":null,"tree":[],"storefront":"/r/JuandaGarcia","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/JuandaGarcia/crd-ui/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}