> For the complete documentation index, see [llms.txt](https://sygnal.gitbook.io/sygnal-webflow-components/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-components/vcard.md).

# VCard ✅

Generate a downloadable VCard for sharing contract information to a phone, or desktop contact manager.  

You can CMS bind all fields. Leverage that for employee directories. 

## Variants

* **Button variant.** Displays a standard Webflow button.  You can change the text, and you can style it using a CSS style string. 
* **Slot variant.**  Place your own custom arrangement of elements in the slot, to act as a click target. The component will intercept the click for the VCard download. 

## Demos

{% embed url="<https://webflow-core-component-test.webflow.io/vcard>" %}

## Best Practices&#x20;

VCards are probably more targeted at mobile phones. It may be worth hiding this element on breakpoints above mobile landscape.  &#x20;

Full Name is required.  First Name and Last Name are also recommended as separate fields.&#x20;

*See future notes.*&#x20;

## Properties&#x20;

*These are the currently supported properties.*&#x20;

| Property         | Type | Notes         |
| ---------------- | ---- | ------------- |
| Full Name        | Text | **Required.** |
| First Name       | Text |               |
| Last Name        | Text |               |
| Organization     | Text |               |
| Title            | Text |               |
| Cell Phone       | Text |               |
| Work Phone       | Text |               |
| Email            | Text |               |
| Additional Email | Text |               |
| Street Address   | Text |               |
| City             | Text |               |
| State / Province | Text |               |
| Postal Code      | Text |               |
| Country          | Text |               |
| Website URL      | Link |               |
| Note             | Text |               |

## Future&#x20;

Might consider adding a QR code option. &#x20;