Home Data visualization What is vCard?

What is vCard?


Every time you communicate with someone you exchange your personal data. You exchange your personal contact information, for example your e-mail, address, phone number and similar. But, giving your information to someone can be very simple because of the growth of the technology and electronic communications. You can make sure to publish your information on safe and easy way and make it more accessible. A traditional way to give someone your contact information is business card printed on paper. But, if you transfer that data digitally then exchange of information can be faster and more correct. And because of that we got vCard.

So, what is vCard?

vCard is the same thing as a simple business card, but in electronic form. It contains a group of personal information that can be placed as text, URL, logo or some audio or even video files and it can be easily exchanged over different applications. vCard can specify different information like identifications (name, picture, date of birth), addresses, communication (phone number, home number, e-mail), company information (name of the company, logo), URL of personal sites and lots of other stuff.

Where is used?

It can be used it lots of different situations and it is surely worth having. Imagine that your friend needs your information, or information of someone else. It would be hard to text or write everything he needs to know to paper or over SMS. Well, you can simply send him the vCard that contains all the necessary information. And if you want to transfer you mobile contacts to your PC? Connect your mobile to the PC and transfer the contacts in the vCard form. You can also exchange all the information you need if you are at the meeting. Instead of writing down the information of every person at the meeting you can just exchange everything with vCard over Bluetooth.

vCard specifications and rules

Like we already mentioned, it is a simple group of personal information or, maybe we should say, attributes about some person. Every attribute has its own name and you can group more attributes inside a vCard. Two of the most popular formats for vCard are standard format that uses certain rules when writing it, attributes and XML format that uses XML rules and XML tags for creating and writing vCard.

  1. Example of standard  format (taken from Wikipedia.org):

example1     2. Example of XML  format (also taken from org):


As you can see, there are three attributes which you must include when creating vCard with standard format and that are “VERSION”, “FN” and “F”. With “VERSION” attribute you must say which version of vCard you are using. “FN” attribute is a place where you give a name for a person who owns the vCard and “N” attribute is used to give the names to that person (surname, name, prefix, suffix and similar). All other elements are used to describe everything else about that person and they can appear zero, once or more times.

How to create it?

There are lots of ways to create your own vCard. For example, there are lots of online sites where you can create your own vCard for free like:

  1. vCard Maker
  2. bvCard
  3. Mobilefish
  4. hCard Creator and lots of others

If you don’t want something simple and you know a lot about design then you should check out some of the Adobe Photoshop tutorials where you can learn to create some amazing vCard designs so you can share your own personal information in a nice way. Check out the list at the site designbump.com that listed 14 great Photoshop tutorials.

And finally, you can create your own vCard in programs like Windows Mail or Outlook Express.

If you open Windows Mail just go to Tools -> Windows Contacts. Then click on New Contact, enter your information and click OK.

If you are using Outlook Express go to Tools -> Address Book. After that click on New -> New Contact, enter the information you need and then click on OK.

Examples of great vCard designs

You learned pretty much everything you need to know about vCard and how to create it. But, you probably want to have something special and not just a simple vCard because as this technology grows, a simple vCard probably won’t be enough to attract interest. To help you with creativity I made a list of some templates where their autors used imagination and some great techniques to create vCard. Find some inspiration in the collection of vCard templates below, which you can also download. Enjoy!

1. Euforia – Responsive Vcard Template


Euforia – is a awesome vCard, responsive HTML5 / CSS3, Bootstrap 3 website template it is going to look awesome on any device! Preview and download here.


2. Balloon – Personal vCard Template


Balloon is a one page personal vCard template with clean responsive design. Balloon is very flexible and it uses LESS to customizing theme colors, so you can easily change colors in just seconds. It also has a very nice animation for pages movement and you can specify whether each page should be placed left or right. Preview and download here.


3. Gentleman – Personal vCard Template


Gentleman is a minimal and clean One Page HTML5 Template which has been built using Twitter Bootstrap framework. Well commented and organized codes will help to customize the template very easily. Preview and download here.


4. MilZinCard – Responsive Vcard Template


MilZinCard is an impressive and professional online vcard, a beautiful portfolio with sliding effect, resume and contact information with Google map. It’s simple! Just download and install in a few minutes, you can show your online card to your friend, customer or employer in an interview by phone or tablet. Because MilZinCard is a responsive html theme, you can view your website on pc as well as handheld devices. You can also link to your social profiles, display your portfolio in many media format such as image, youtube video, flash…. From the back-end, you can choose skin for your website. MilZinCard supports 30 unique color skins (Yellow, Red, Green, Blue, Gray and rose…). Preview and download here.


5. FlexyVcard – Responsive Vcard Template


FlexyVcard is an impressive and professional online vcard, a beautiful portfolio with sliding effect, resume and contact information with Google map. It’s simple! Just download and install in a few minutes, you can show your online card to your friend, customer or employer in an interview by phone or tablet. Preview and download here.


6. cvCard – Responsive vCard Template


Features: HTML5, CSS3, Responsive Design, Retina ready, jQuery powered. CSS3 Sliding Horizontal layout with fallback to classic layout for non-supported browsers. Optimized performance for mobile devices. Filtered portfolio with solid ajax portfolio details and custom styled-mobile optimized lightbox. Both support image and video. Blog with post formats. Self hosted html5 audio/video (one .mp4 file for all browsers!). Responsive video embed in various aspect ratios (youtube/vimeo …). Cross browser styled form elements. Optimized for retina screens. Easy to customize : 4 predefined styles. 50+ awesome CSS3 effect for portfolio page in-out animations. Working ajax contact form with validation. 30+ popular social icons. Cross browser compatible. Extensive Documentation & Support Forum. Preview and download here.


7. Hello VCard


Hello is a Virtual Bussiness Card template simple and easy to customize. Implemented using the latest standards, powered by JQuery brings nice flash like animations. It has also a xHTML valid code, and working php form contact. Preview and download here.


8. UkieCard – Personal Vcard & Resume HTML Template


UkieCard – Vcard Resume HTML Template is a Good Idea special for you. Simple and Creative Solution for Your Portfolio & Resume website. Preview and download here.


9. vCard Responsive HTML Template

vCard is a minimalistic personal vCard HTML Template, an impressive and professional online vcard, a beautiful portfolio, resume, skills and contact information with Google map. Theme comes loaded with dark and light skin, possibility to set unlimited colors, 14 predefined color schemes and unlimited background colors, 14 predefined backgrounds colors, light and dark color for logo text. There is also possibility to define custom background image. vCard is fully customizable with build-in lightbox, google map, ajax contact form, skills and languages skills. Preview and download here.


10. Confidence Responsive VCard Template


Confidence V-card is an easy cutomizable v-card/portfolio/mini website template made entirely 95% with html and css it allows you to introduce yourself with the most important information to your features clients or employers. Confidence V-card can be used also as a mini website for a small company that want to be introduced quickly and easily. Preview and download here.