Playground

PhonePhone

Country inputCountry input

select

Country displayCountry display

SVG

Display formatDisplay format

national

Model formatModel format

e164

VariantVariant

filled

DensityDensity

default

Country
-

Model value
-

Valid
No

npm

$ npm add v-phone-input flag-icons

pnpm

$ pnpm add v-phone-input flag-icons

yarn

$ yarn add v-phone-input flag-icons

bun

$ bun add v-phone-input 2flag-icons

plugin.ts

import 'flag-icons/css/flag-icons.min.css';
import 'v-phone-input/styles';
import { createVPhoneInput, selectPhoneCountryInput, VPhoneCountryFlagSvg } from 'v-phone-input';

const vPhoneInput = createVPhoneInput({
  ...selectPhoneCountryInput,
  countryDisplayComponent: VPhoneCountryFlagSvg,
})