UX4G Flutter #

Community Implementation of Government of India UX4G and DBIM Design System for Flutter.

A production-ready, pixel-perfect Flutter UI library that implements the UX4G (User Experience for Government) and DBIM (Digital Bharat Interface Guidelines) design systems.

Features #

• 🏛️ Official Design Tokens: Exact colors, typography, spacing, and shadows from UX4G.
• 🎨 Theming: Full light and dark mode support with Ux4gTheme.
• 🧩 25+ Components: Buttons, inputs, navigation, layout, and feedback components.
• ♿ Accessibility: WCAG AA compliant contrast, semantic labels, and focus management.
• 📱 Responsive: Built-in responsive utilities for mobile, tablet, and desktop.
• 🇮🇳 Government Ready: Designed for building applications following government standards.

Installation #

Add ux4g to your pubspec.yaml:

dependencies:
  ux4g: ^0.1.0

Usage #

1. Wrap your app with Ux4gTheme:

import 'package:flutter/material.dart';
import 'package:ux4g/ux4g.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'My Government App',
      theme: Ux4gTheme.light,
      darkTheme: Ux4gTheme.dark,
      home: const HomePage(),
    );
  }
}

2. Use UX4G components:

Ux4gButton(
  onPressed: () {},
  variant: Ux4gButtonVariant.primary,
  child: const Text('Submit Application'),
)

Documentation #

For detailed documentation, please see the docs_wip folder or visit the API Reference.

Contributing #

We welcome contributions! Please see CONTRIBUTING.md for details.

License #

This project is licensed under the AGPL-3.0 License.