diff --git a/README.md b/README.md
index 136600f..2723bf9 100644
--- a/README.md
+++ b/README.md
@@ -41,6 +41,7 @@ Each exchange is manual, error-prone, and slow. DevCard fixes this.
 - 🔗 **Universal Profile Aggregation** — GitHub, LinkedIn, Twitter/X, GitLab, Devfolio, and 10+ more platforms
 - 📱 **QR Code Sharing** — Show your QR, they scan, done
 - ⚡ **One-Screen Multi-Platform Connect** — Follow on GitHub, Connect on LinkedIn, all from one card
+- 📥 **vCard Export & Contact Saving** — Save developer contact cards (.vcf) natively with one tap to your phone book
 - 📈 **Advanced Analytics** — Track who viewed your card, when, and from where (Web, QR, App)
 - 🔌 **Per-Platform OAuth Integrations** — Securely connect accounts for "Silent Follows"
 - 🎯 **Context Cards** — Different cards for different situations (Professional, Hackathon, Community)
@@ -48,6 +49,7 @@ Each exchange is manual, error-prone, and slow. DevCard fixes this.
 - 🔒 **Privacy-First** — No tracking, no data selling, your data stays yours
 - 🛠️ **Open Source** — Apache 2.0 licensed, community-governed
 
+
 ## Quick Start
 
 ### Prerequisites
@@ -273,6 +275,31 @@ New to open source? We've got you covered! Check out our [Good First Issues](htt
 
 See [CONTRIBUTING.md](./CONTRIBUTING.md) for setup instructions, coding standards, and PR process.
 
+## vCard Export Support
+
+DevCard supports exporting contact cards in the industry-standard `.vcf` (vCard 3.0) format directly from both Svelte web and React Native mobile applications. This allows seamless integration with native OS contact books.
+
+### Supported Fields
+
+The shared generator maps the following profile attributes dynamically:
+- **Full Name (`FN` / `N`)**: Parsed and split into first and last names.
+- **Organization (`ORG`)**: Maps to the user's `company`.
+- **Title (`TITLE`)**: Maps to the user's `role`.
+- **Email (`EMAIL`)**: Automatically checks and extracts public email from profile settings and connected platform links.
+- **Phone (`TEL`)**: Automatically parses public phone/WhatsApp URLs and numbers from custom touchpoints.
+- **Bio/Notes (`NOTE`)**: Combines personal bio, pronouns, and role description, with proper character escaping.
+- **Avatar (`PHOTO`)**: Embeds profile picture via high-performance native image URL loading.
+- **Touchpoints (`URL`)**: Appends up to 10+ social/profile links as separate labelled URL entries.
+
+### Platform Compatibility
+
+Verified and tested on the following native contact managers and apps:
+- **iOS Contacts** (Native contact save flow via Blob + Mobile Safari)
+- **Android Contacts** (Native Google Contacts save flow via Mobile Chrome and Native Share Sheet)
+- **Apple Contacts & macOS** (Seamless importing of `.vcf` files)
+- **Google Contacts** (Standard desktop web and mobile compatibility)
+- **Microsoft Outlook** (Clean parsing and field population)
+
 ## License
 
 DevCard is licensed under the [Apache License 2.0](./LICENSE).
@@ -282,3 +309,4 @@ DevCard is licensed under the [Apache License 2.0](./LICENSE).
 <p align="center">
   Built with ❤️ by the developer community, for the developer community.
 </p>
+
diff --git a/apps/mobile/src/components/SaveContactButton.tsx b/apps/mobile/src/components/SaveContactButton.tsx
new file mode 100644
index 0000000..98f0be2
--- /dev/null
+++ b/apps/mobile/src/components/SaveContactButton.tsx
@@ -0,0 +1,147 @@
+import React, { useState } from 'react';
+import {
+  TouchableOpacity,
+  Text,
+  StyleSheet,
+  ActivityIndicator,
+  Share,
+  Platform,
+  Alert,
+  View,
+} from 'react-native';
+import { COLORS, SPACING, FONT_SIZE, BORDER_RADIUS, SHADOWS } from '../theme/tokens';
+import { getProfileVCard, encodeBase64 } from '../utils/vcard';
+import { APP_URL } from '../config';
+
+interface PlatformLink {
+  id: string;
+  platform: string;
+  username: string;
+  url: string;
+  displayOrder: number;
+}
+
+interface ProfileData {
+  username: string;
+  displayName: string;
+  bio: string | null;
+  pronouns: string | null;
+  role: string | null;
+  company: string | null;
+  avatarUrl: string | null;
+  accentColor: string;
+  links: PlatformLink[];
+}
+
+interface SaveContactButtonProps {
+  profile: ProfileData;
+}
+
+export function SaveContactButton({ profile }: SaveContactButtonProps) {
+  const [loading, setLoading] = useState(false);
+
+  const handleSaveContact = async () => {
+    setLoading(true);
+    try {
+      const devcardUrl = `${APP_URL}/u/${profile.username}`;
+      
+      const vcardContent = getProfileVCard({
+        displayName: profile.displayName,
+        username: profile.username,
+        bio: profile.bio,
+        pronouns: profile.pronouns,
+        role: profile.role,
+        company: profile.company,
+        avatarUrl: profile.avatarUrl,
+        links: profile.links,
+        devcardUrl,
+      });
+
+      if (Platform.OS === 'ios') {
+        const base64Vcf = encodeBase64(vcardContent);
+        const fileUri = `data:text/vcard;charset=utf-8;base64,${base64Vcf}`;
+        
+        await Share.share({
+          url: fileUri,
+          message: `Save contact info for ${profile.displayName}`,
+        });
+      } else {
+        // Android and others: Share the vCard content directly as message text
+        await Share.share({
+          message: vcardContent,
+          title: `Save ${profile.displayName}'s Contact`,
+        });
+      }
+    } catch (err) {
+      console.error('Failed to share contact:', err);
+      Alert.alert('Error', 'Failed to export contact card.');
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const accentColor = profile.accentColor || COLORS.primary;
+
+  return (
+    <TouchableOpacity
+      style={[
+        styles.button,
+        {
+          borderColor: accentColor,
+          shadowColor: accentColor,
+        },
+      ]}
+      onPress={handleSaveContact}
+      disabled={loading}
+      activeOpacity={0.8}
+      accessibilityRole="button"
+      accessibilityLabel={`Save ${profile.displayName}'s contact info to your phone`}
+    >
+      {loading ? (
+        <View style={styles.content}>
+          <ActivityIndicator size="small" color={COLORS.white} style={styles.spinner} />
+          <Text style={styles.text}>Saving...</Text>
+        </View>
+      ) : (
+        <View style={styles.content}>
+          <Text style={styles.icon}>📥</Text>
+          <Text style={styles.text}>Save Contact</Text>
+        </View>
+      )}
+    </TouchableOpacity>
+  );
+}
+
+const styles = StyleSheet.create({
+  button: {
+    backgroundColor: 'rgba(255, 255, 255, 0.05)',
+    borderRadius: BORDER_RADIUS.md,
+    paddingVertical: SPACING.md,
+    paddingHorizontal: SPACING.lg,
+    borderWidth: 1.5,
+    alignItems: 'center',
+    justifyContent: 'center',
+    marginVertical: SPACING.md,
+    width: '100%',
+    ...SHADOWS.button,
+  },
+  content: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+  icon: {
+    fontSize: FONT_SIZE.md,
+    color: COLORS.white,
+    marginRight: SPACING.sm,
+  },
+  text: {
+    fontSize: FONT_SIZE.md,
+    fontWeight: '700',
+    color: COLORS.white,
+    letterSpacing: 0.5,
+  },
+  spinner: {
+    marginRight: SPACING.sm,
+  },
+});
diff --git a/apps/mobile/src/screens/DevCardViewScreen.tsx b/apps/mobile/src/screens/DevCardViewScreen.tsx
index 46cf951..61f14e6 100644
--- a/apps/mobile/src/screens/DevCardViewScreen.tsx
+++ b/apps/mobile/src/screens/DevCardViewScreen.tsx
@@ -15,6 +15,7 @@ import {
 import { SafeAreaView } from 'react-native-safe-area-context';
 import { COLORS, SPACING, FONT_SIZE, BORDER_RADIUS, SHADOWS } from '../theme/tokens';
 import { Skeleton } from '../components/Skeleton';
+import { SaveContactButton } from '../components/SaveContactButton';
 import { PLATFORMS, getProfileUrl, getWebViewUrl } from '@devcard/shared';
 import { API_BASE_URL } from '../config';
 import { useAuth } from '../context/AuthContext';
@@ -284,6 +285,9 @@ export default function DevCardViewScreen({ navigation, route }: Props) {
           </View>
         </View>
 
+        {/* Save Contact Action */}
+        <SaveContactButton profile={profile} />
+
         {/* Platform Tiles Section */}
         <View style={styles.tilesSection}>
           <Text style={styles.tilesLabel}>Digital Touchpoints</Text>
diff --git a/apps/mobile/src/utils/vcard.ts b/apps/mobile/src/utils/vcard.ts
new file mode 100644
index 0000000..8d83c61
--- /dev/null
+++ b/apps/mobile/src/utils/vcard.ts
@@ -0,0 +1,52 @@
+/* eslint-disable no-bitwise */
+import { generateVCard, VCardInput } from '@devcard/shared';
+
+/**
+ * Mobile-specific utility wrapper for generating vCard strings.
+ */
+export function getProfileVCard(profile: VCardInput): string {
+  return generateVCard(profile);
+}
+
+/**
+ * Encodes a string into Base64 format using a pure JavaScript implementation.
+ * Safe to use in any React Native environment without relying on Node.js Buffer or browser btoa.
+ */
+export function encodeBase64(str: string): string {
+  const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
+  let result = '';
+  let i = 0;
+  
+  // Convert string to UTF-8 byte array to preserve non-ASCII characters
+  const utf8Bytes: number[] = [];
+  for (let j = 0; j < str.length; j++) {
+    let c = str.charCodeAt(j);
+    if (c < 128) {
+      utf8Bytes.push(c);
+    } else if (c < 2048) {
+      utf8Bytes.push((c >> 6) | 192);
+      utf8Bytes.push((c & 63) | 128);
+    } else {
+      utf8Bytes.push((c >> 12) | 224);
+      utf8Bytes.push(((c >> 6) & 63) | 128);
+      utf8Bytes.push((c & 63) | 128);
+    }
+  }
+
+  const byteLength = utf8Bytes.length;
+  while (i < byteLength) {
+    const byte1 = utf8Bytes[i++];
+    const byte2 = i < byteLength ? utf8Bytes[i++] : NaN;
+    const byte3 = i < byteLength ? utf8Bytes[i++] : NaN;
+
+    const enc1 = byte1 >> 2;
+    const enc2 = ((byte1 & 3) << 4) | (isNaN(byte2) ? 0 : byte2 >> 4);
+    const enc3 = isNaN(byte2) ? 64 : ((byte2 & 15) << 2) | (isNaN(byte3) ? 0 : byte3 >> 6);
+    const enc4 = isNaN(byte3) ? 64 : byte3 & 63;
+
+    result += chars.charAt(enc1) + chars.charAt(enc2) +
+              (enc3 === 64 ? '=' : chars.charAt(enc3)) +
+              (enc4 === 64 ? '=' : chars.charAt(enc4));
+  }
+  return result;
+}
diff --git a/apps/web/src/lib/components/SaveContactButton.svelte b/apps/web/src/lib/components/SaveContactButton.svelte
new file mode 100644
index 0000000..85d3301
--- /dev/null
+++ b/apps/web/src/lib/components/SaveContactButton.svelte
@@ -0,0 +1,134 @@
+<script lang="ts">
+  import { generateVCard, type PublicProfile } from '@devcard/shared';
+  import { page } from '$app/stores';
+
+  let { profile }: { profile: PublicProfile } = $props();
+
+  let loading = $state(false);
+  let errorMsg = $state('');
+
+  function handleSaveContact() {
+    loading = true;
+    errorMsg = '';
+    
+    try {
+      const devcardUrl = $page.url.href;
+      
+      const vcardContent = generateVCard({
+        displayName: profile.displayName,
+        username: profile.username,
+        bio: profile.bio,
+        pronouns: profile.pronouns,
+        role: profile.role,
+        company: profile.company,
+        avatarUrl: profile.avatarUrl,
+        links: profile.links,
+        devcardUrl,
+      });
+
+      const blob = new Blob([vcardContent], { type: 'text/vcard;charset=utf-8;' });
+      const url = URL.createObjectURL(blob);
+      
+      const link = document.createElement('a');
+      link.href = url;
+      link.setAttribute('download', `${profile.username || 'contact'}.vcf`);
+      
+      link.style.display = 'none';
+      document.body.appendChild(link);
+      link.click();
+      
+      document.body.removeChild(link);
+      URL.revokeObjectURL(url);
+    } catch (err) {
+      console.error('Failed to generate contact card:', err);
+      errorMsg = 'Failed to generate contact card.';
+    } finally {
+      loading = false;
+    }
+  }
+</script>
+
+<button
+  type="button"
+  class="save-contact-btn glass"
+  onclick={handleSaveContact}
+  disabled={loading}
+  aria-label="Save {profile.displayName}'s contact information to your device"
+>
+  {#if loading}
+    <span class="spinner" aria-hidden="true"></span>
+    Saving...
+  {:else}
+    <span class="icon" aria-hidden="true">📥</span>
+    Save Contact
+  {/if}
+</button>
+
+{#if errorMsg}
+  <p class="error-text" role="alert">{errorMsg}</p>
+{/if}
+
+<style>
+  .save-contact-btn {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    gap: 0.65rem;
+    padding: 0.75rem 1.5rem;
+    border-radius: var(--radius);
+    font-weight: 700;
+    font-size: 0.95rem;
+    cursor: pointer;
+    background: rgba(255, 255, 255, 0.08);
+    border: 1px solid var(--border-glass);
+    color: var(--text-primary);
+    transition: transform 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
+    margin-top: 1rem;
+    width: 100%;
+    max-width: 240px;
+  }
+
+  .save-contact-btn:hover:not(:disabled) {
+    background: rgba(255, 255, 255, 0.15);
+    border-color: rgba(99, 102, 241, 0.35);
+    transform: translateY(-2px);
+  }
+
+  .save-contact-btn:active:not(:disabled) {
+    transform: translateY(0);
+  }
+
+  .save-contact-btn:focus-visible {
+    outline: 3px solid var(--primary-glow);
+    outline-offset: 3px;
+  }
+
+  .save-contact-btn:disabled {
+    opacity: 0.6;
+    cursor: not-allowed;
+  }
+
+  .icon {
+    font-size: 1.1rem;
+  }
+
+  .spinner {
+    width: 1rem;
+    height: 1rem;
+    border: 2px solid currentColor;
+    border-top-color: transparent;
+    border-radius: 50%;
+    animation: spin 0.8s linear infinite;
+  }
+
+  @keyframes spin {
+    to { transform: rotate(360deg); }
+  }
+
+  .error-text {
+    color: #ef4444;
+    font-size: 0.85rem;
+    margin-top: 0.5rem;
+    font-weight: 500;
+  }
+</style>
diff --git a/apps/web/src/lib/index.ts b/apps/web/src/lib/index.ts
index 856f2b6..c3e8db5 100644
--- a/apps/web/src/lib/index.ts
+++ b/apps/web/src/lib/index.ts
@@ -1 +1,2 @@
 // place files you want to import through the `$lib` alias in this folder.
+export { default as SaveContactButton } from './components/SaveContactButton.svelte';
diff --git a/apps/web/src/routes/u/[username]/+page.svelte b/apps/web/src/routes/u/[username]/+page.svelte
index bb23cca..564f4b0 100644
--- a/apps/web/src/routes/u/[username]/+page.svelte
+++ b/apps/web/src/routes/u/[username]/+page.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
   import { PLATFORMS, getProfileUrl } from '@devcard/shared';
+  import { SaveContactButton } from '$lib';
   import { onMount } from 'svelte';
 
   let { data } = $props();
@@ -100,6 +101,8 @@
         {#if profile.bio}
           <p class="bio">{profile.bio}</p>
         {/if}
+        
+        <SaveContactButton {profile} />
       </header>
 
       <div class="links-grid">
diff --git a/packages/shared/src/index.ts b/packages/shared/src/index.ts
index a57e7e7..ff27dc2 100644
--- a/packages/shared/src/index.ts
+++ b/packages/shared/src/index.ts
@@ -1,2 +1,3 @@
 export * from './platforms';
 export * from './types';
+export * from './vcard';
diff --git a/packages/shared/src/vcard.test.ts b/packages/shared/src/vcard.test.ts
new file mode 100644
index 0000000..9d05315
--- /dev/null
+++ b/packages/shared/src/vcard.test.ts
@@ -0,0 +1,121 @@
+import { describe, it, expect } from 'vitest';
+import { generateVCard, VCardInput } from './vcard';
+import { PlatformLink } from './types';
+
+describe('vCard Generator', () => {
+  const mockLinks: PlatformLink[] = [
+    {
+      id: '1',
+      platform: 'github',
+      username: 'octocat',
+      url: 'https://github.com/octocat',
+      displayOrder: 1,
+    },
+    {
+      id: '2',
+      platform: 'linkedin',
+      username: 'octo-li',
+      url: 'https://linkedin.com/in/octo-li',
+      displayOrder: 2,
+    },
+    {
+      id: '3',
+      platform: 'email',
+      username: 'octocat@github.com',
+      url: 'mailto:octocat@github.com',
+      displayOrder: 3,
+    },
+  ];
+
+  it('should generate basic vCard with correct metadata and name splitting', () => {
+    const profile: VCardInput = {
+      displayName: 'Jane Doe',
+      username: 'janedoe',
+      bio: 'Software engineer from the cloud.',
+      pronouns: 'she/her',
+      role: 'Staff Engineer',
+      company: 'Acme Corp',
+      avatarUrl: 'https://example.com/avatar.jpg',
+      links: mockLinks,
+      devcardUrl: 'https://devcard.dev/u/janedoe',
+    };
+
+    const vcard = generateVCard(profile);
+    
+    // Check line endings are CRLF
+    expect(vcard).toContain('\r\n');
+    
+    const lines = vcard.split('\r\n');
+    expect(lines[0]).toBe('BEGIN:VCARD');
+    expect(lines[1]).toBe('VERSION:3.0');
+    expect(vcard).toContain('FN:Jane Doe');
+    expect(vcard).toContain('N:Doe;Jane;;;');
+    expect(vcard).toContain('ORG:Acme Corp');
+    expect(vcard).toContain('TITLE:Staff Engineer');
+    expect(vcard).toContain('EMAIL;TYPE=INTERNET:octocat@github.com');
+    expect(vcard).toContain('NOTE:Software engineer from the cloud.\\nPronouns: she/her\\nRole: Staff Engineer @ Acme Corp');
+
+    expect(vcard).toContain('PHOTO;VALUE=URI:https://example.com/avatar.jpg');
+    expect(vcard).toContain('URL;type=DevCard:https://devcard.dev/u/janedoe');
+    expect(vcard).toContain('URL;type=Github:https://github.com/octocat');
+    expect(vcard).toContain('URL;type=Linkedin:https://linkedin.com/in/octo-li');
+    // Ensure email is not listed in URL;type=Email
+    expect(vcard).not.toContain('URL;type=Email');
+    expect(lines[lines.length - 1]).toBe('END:VCARD');
+  });
+
+  it('should escape semicolons, commas, backslashes, and multiline bios', () => {
+    const profile: VCardInput = {
+      displayName: 'Doe, John; Jr.',
+      username: 'johndoe',
+      bio: 'Hello \\ World;\nNew Line, here.',
+      role: 'Senior; Developer',
+      company: 'Acme, Inc.',
+    };
+
+    const vcard = generateVCard(profile);
+    
+    expect(vcard).toContain('FN:Doe\\, John\\; Jr.');
+    expect(vcard).toContain('ORG:Acme\\, Inc.');
+    expect(vcard).toContain('TITLE:Senior\\; Developer');
+    expect(vcard).toContain('NOTE:Hello \\\\ World\\;\\nNew Line\\, here.');
+  });
+
+  it('should split single names correctly and handle missing fields gracefully', () => {
+    const profile: VCardInput = {
+      displayName: 'Cher',
+      username: 'cher',
+    };
+
+    const vcard = generateVCard(profile);
+    
+    expect(vcard).toContain('FN:Cher');
+    expect(vcard).toContain('N:;Cher;;;');
+    expect(vcard).not.toContain('ORG:');
+    expect(vcard).not.toContain('TITLE:');
+    expect(vcard).not.toContain('EMAIL:');
+    expect(vcard).not.toContain('NOTE:');
+  });
+
+  it('should parse email and tel protocol URLs correctly', () => {
+    const linksWithProtocols: PlatformLink[] = [
+      {
+        id: '1',
+        platform: 'custom',
+        username: '+1234567890',
+        url: 'tel:+1234567890',
+        displayOrder: 1,
+      },
+    ];
+
+    const profile: VCardInput = {
+      displayName: 'Bob Smith',
+      username: 'bob',
+      links: linksWithProtocols,
+    };
+
+    const vcard = generateVCard(profile);
+    
+    expect(vcard).toContain('TEL;TYPE=CELL:+1234567890');
+  });
+});
diff --git a/packages/shared/src/vcard.ts b/packages/shared/src/vcard.ts
new file mode 100644
index 0000000..a0bbf89
--- /dev/null
+++ b/packages/shared/src/vcard.ts
@@ -0,0 +1,137 @@
+import type { PlatformLink } from './types';
+import { getProfileUrl } from './platforms';
+
+export interface VCardInput {
+  displayName: string;
+  username: string;
+  bio?: string | null;
+  pronouns?: string | null;
+  role?: string | null;
+  company?: string | null;
+  avatarUrl?: string | null;
+  links?: PlatformLink[];
+  devcardUrl?: string;
+  email?: string | null;
+  phone?: string | null;
+}
+
+/**
+ * Escapes characters for vCard compatibility per RFC 2426 specs.
+ * Backslashes, semicolons, commas, and newlines must be escaped.
+ */
+function escapeValue(val: string | null | undefined): string {
+  if (!val) return '';
+  return val
+    .replace(/\\/g, '\\\\')
+    .replace(/;/g, '\\;')
+    .replace(/,/g, '\\,')
+    .replace(/\r?\n/g, '\\n');
+}
+
+/**
+ * Generates a valid type-safe vCard (.vcf) string from DevCard profile data.
+ * Adheres to standard vCard 3.0 specification.
+ */
+export function generateVCard(profile: VCardInput): string {
+  const displayName = (profile.displayName || profile.username || 'Developer').trim();
+  
+  // Parse first and last name for structured N field
+  const nameParts = displayName.split(/\s+/);
+  const lastName = nameParts.length > 1 ? nameParts.pop() || '' : '';
+  const firstName = nameParts.join(' ');
+
+  const lines: string[] = [
+    'BEGIN:VCARD',
+    'VERSION:3.0',
+    `N:${escapeValue(lastName)};${escapeValue(firstName)};;;`,
+    `FN:${escapeValue(displayName)}`,
+  ];
+
+  if (profile.company) {
+    lines.push(`ORG:${escapeValue(profile.company)}`);
+  }
+
+  if (profile.role) {
+    lines.push(`TITLE:${escapeValue(profile.role)}`);
+  }
+
+  // Determine public email and phone number
+  let email = profile.email || '';
+  let phone = profile.phone || '';
+
+  if (profile.links) {
+    for (const link of profile.links) {
+      if (link.platform === 'email') {
+        email = link.username || email;
+      } else if (link.platform === 'phone' || link.platform === 'tel') {
+        phone = link.username || phone;
+      } else if (link.url) {
+        if (link.url.startsWith('mailto:')) {
+          email = link.url.substring(7) || email;
+        } else if (link.url.startsWith('tel:')) {
+          phone = link.url.substring(4) || phone;
+        }
+      }
+    }
+  }
+
+  if (email) {
+    lines.push(`EMAIL;TYPE=INTERNET:${escapeValue(email)}`);
+  }
+
+  if (phone) {
+    lines.push(`TEL;TYPE=CELL:${escapeValue(phone)}`);
+  }
+
+  // Construct NOTE/bio/pronouns/role details
+  const noteParts: string[] = [];
+  if (profile.bio) {
+    noteParts.push(profile.bio);
+  }
+  if (profile.pronouns) {
+    noteParts.push(`Pronouns: ${profile.pronouns}`);
+  }
+  if (profile.role || profile.company) {
+    const roleStr = [profile.role, profile.company].filter(Boolean).join(' @ ');
+    noteParts.push(`Role: ${roleStr}`);
+  }
+
+  if (noteParts.length > 0) {
+    lines.push(`NOTE:${escapeValue(noteParts.join('\n'))}`);
+  }
+
+  // Include dynamic profile picture loading
+  if (profile.avatarUrl) {
+    lines.push(`PHOTO;VALUE=URI:${escapeValue(profile.avatarUrl)}`);
+  }
+
+  // Support social URLs
+  const socialUrls: { label: string; url: string }[] = [];
+  if (profile.devcardUrl) {
+    socialUrls.push({ label: 'DevCard', url: profile.devcardUrl });
+  } else {
+    socialUrls.push({ label: 'DevCard', url: `https://devcard.dev/u/${profile.username}` });
+  }
+
+  if (profile.links) {
+    for (const link of profile.links) {
+      // Avoid duplicate listing for email link as URL if it's already an email field
+      if (link.platform === 'email') continue;
+
+      const url = link.url || getProfileUrl(link.platform, link.username);
+      if (url) {
+        const label = link.platform.charAt(0).toUpperCase() + link.platform.slice(1);
+        socialUrls.push({ label, url });
+      }
+    }
+  }
+
+  socialUrls.forEach(social => {
+    lines.push(`URL;type=${escapeValue(social.label)}:${escapeValue(social.url)}`);
+  });
+
+  lines.push('END:VCARD');
+
+  // Must end each line with CRLF (\r\n) per RFC standard
+  return lines.join('\r\n');
+}