Font Awesome Free Brands

import { faFacebook, faTwitter, faGithub, prefix } from '@fortawesome/fontawesome-free-brands';

import { 
  faFacebook, 
  faTwitter, 
  faInstagram, 
  faLinkedin,
  faGithub,
  IconDefinition 
} from '@fortawesome/fontawesome-free-brands';

import pack from '@fortawesome/fontawesome-free-brands';

const { faFacebook, faTwitter, faGithub, prefix } = require('@fortawesome/fontawesome-free-brands');

import { library, icon } from '@fortawesome/fontawesome-svg-core';
import { faFacebook, faTwitter, faGithub } from '@fortawesome/fontawesome-free-brands';

// Add icons to the library
library.add(faFacebook, faTwitter, faGithub);

// Create icon instances
const facebookIcon = icon({ prefix: 'fab', iconName: 'facebook' });
const twitterIcon = icon({ prefix: 'fab', iconName: 'twitter' });

// Insert into DOM
document.body.appendChild(facebookIcon.node[0]);

// Social Media Icons
export const faFacebook: IconDefinition;
export const faFacebookF: IconDefinition;
export const faFacebookSquare: IconDefinition;
export const faFacebookMessenger: IconDefinition;
export const faTwitter: IconDefinition;
export const faTwitterSquare: IconDefinition;
export const faInstagram: IconDefinition;
export const faLinkedin: IconDefinition;
export const faLinkedinIn: IconDefinition;
export const faYoutube: IconDefinition;
export const faYoutubeSquare: IconDefinition;

// Technology & Development Icons
export const faGithub: IconDefinition;
export const faGithubAlt: IconDefinition;
export const faGithubSquare: IconDefinition;
export const faGitlab: IconDefinition;
export const faGit: IconDefinition;
export const faGitSquare: IconDefinition;
export const faStackOverflow: IconDefinition;
export const faCodepen: IconDefinition;
export const faReact: IconDefinition;
export const faAngular: IconDefinition;
export const faVuejs: IconDefinition;
export const faNodeJs: IconDefinition;
export const faNpm: IconDefinition;

// Payment & E-commerce Icons
export const faPaypal: IconDefinition;
export const faStripe: IconDefinition;
export const faStripeS: IconDefinition;
export const faApplePay: IconDefinition;
export const faAmazonPay: IconDefinition;
export const faCcVisa: IconDefinition;
export const faCcMastercard: IconDefinition;
export const faCcAmex: IconDefinition;
export const faCcPaypal: IconDefinition;

// Operating Systems & Browsers
export const faWindows: IconDefinition;
export const faApple: IconDefinition;
export const faLinux: IconDefinition;
export const faAndroid: IconDefinition;
export const faChrome: IconDefinition;
export const faFirefox: IconDefinition;
export const faSafari: IconDefinition;
export const faEdge: IconDefinition;

// Gaming & Entertainment
export const faPlaystation: IconDefinition;
export const faXbox: IconDefinition;
export const faNintendoSwitch: IconDefinition;
export const faSteam: IconDefinition;
export const faTwitch: IconDefinition;
export const faSpotify: IconDefinition;

// Cloud & Infrastructure
export const faAws: IconDefinition;
export const faDigitalOcean: IconDefinition;
export const faDocker: IconDefinition;

// Additional icons (300+ more available)
// Complete list includes all major brands across categories:
// - Social platforms (Discord, Snapchat, TikTok, etc.)
// - Development tools (Jenkins, GitKraken, etc.)
// - Cryptocurrency (Bitcoin, Ethereum, etc.)
// - Media platforms (Medium, WordPress, etc.)
// - Communication apps (Slack, Telegram, WhatsApp, etc.)
// - Star Wars themed icons
// - And many more...

declare const pack: IconPack;
export default pack;

export const prefix: 'fab';

// Re-exported from @fortawesome/fontawesome-common-types
export interface IconDefinition {
  prefix: IconPrefix;
  iconName: IconName;
  icon: [
    number, // width
    number, // height
    string[], // ligatures
    string, // unicode
    string // svgPathData
  ];
}

export interface IconLookup {
  prefix: IconPrefix;
  iconName: IconName;
}

export type IconName = string;
export type IconPrefix = 'fab'; // Always 'fab' for brand icons
export interface IconPack {
  [key: string]: IconDefinition;
}

import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faFacebook, faTwitter } from '@fortawesome/fontawesome-free-brands';

function SocialIcons() {
  return (
    <div>
      <FontAwesomeIcon icon={faFacebook} />
      <FontAwesomeIcon icon={faTwitter} />
    </div>
  );
}

import { library } from '@fortawesome/fontawesome-svg-core';
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
import { faGithub, faLinkedin } from '@fortawesome/fontawesome-free-brands';

library.add(faGithub, faLinkedin);

// In template: <font-awesome-icon :icon="['fab', 'github']" />

import { faTwitter, prefix } from '@fortawesome/fontawesome-free-brands';

// Icon structure
console.log(faTwitter);
// {
//   prefix: 'fab',
//   iconName: 'twitter', 
//   icon: [512, 512, [], "f099", "M459.37 151.716c.325..."]
// }

// Use the prefix constant
console.log(prefix); // 'fab'

// Extract SVG path data
const [width, height, ligatures, unicode, pathData] = faTwitter.icon;

import type { IconDefinition } from '@fortawesome/fontawesome-free-brands';

async function loadSocialIcon(platform: string): Promise<IconDefinition> {
  switch (platform) {
    case 'facebook':
      const { faFacebook } = await import('@fortawesome/fontawesome-free-brands');
      return faFacebook;
    case 'twitter':
      const { faTwitter } = await import('@fortawesome/fontawesome-free-brands');
      return faTwitter;
    case 'github':
      const { faGithub } = await import('@fortawesome/fontawesome-free-brands');
      return faGithub;
    default:
      throw new Error(`Unknown platform: ${platform}`);
  }
}

import pack from '@fortawesome/fontawesome-free-brands';

// List all available brand icons
const availableIcons = Object.keys(pack);
console.log(`Available icons: ${availableIcons.length}`); // 363

// Find icons by pattern
const socialIcons = availableIcons.filter(name => 
  ['facebook', 'twitter', 'instagram', 'linkedin'].some(social => 
    name.toLowerCase().includes(social)
  )
);

npm install @fortawesome/fontawesome-svg-core