🇵🇭 Philippine Government Icons

A comprehensive library of Philippine government icons and symbols for developers

Get Started View on GitHub

✨ Features

🏛️ Complete Coverage

Icons for all major Philippine government agencies, departments, and official symbols

🎨 Multiple Formats

CSS, React, Vue, Angular, Svelte, and Web Components - choose what works for you

📦 Tree-shaking

Import only the icons you need to keep your bundle size minimal

🎯 Accessibility

WCAG 2.1 AA compliant icons with proper semantic markup

📱 Responsive

Optimized for all screen sizes and devices

🚀 Performance

Lightweight SVG icons with optimized paths for fast loading

📦 Installation

Choose the package that fits your project:

React

npm install @ph-gov-icons/react

Vue

npm install @ph-gov-icons/vue

Angular

npm install @ph-gov-icons/angular

CSS

npm install @ph-gov-icons/css

Web Components

npm install @ph-gov-icons/web-components

Svelte

npm install @ph-gov-icons/svelte

💻 Usage Examples

React

import { PhFlag, Malacanang, DepEd } from '@ph-gov-icons/react';

function App() {
  return (
    <div>
      <PhFlag size={24} />
      <Malacanang size={32} />
      <DepEd size={24} />
    </div>
  );
}

Vue

<template>
  <div>
    <PhFlag :size="24" />
    <Malacanang :size="32" />
    <DepEd :size="24" />
  </div>
</template>

<script>
import { PhFlag, Malacanang, DepEd } from '@ph-gov-icons/vue';
</script>

CSS

<link rel="stylesheet" href="node_modules/@ph-gov-icons/css/ph-gov-icons.css">

<i class="ph-icon ph-icon-flag"></i>
<i class="ph-icon ph-icon-malacanang"></i>
<i class="ph-icon ph-icon-deped"></i>