zeba_academy_glassmorphism

A beautiful Flutter glassmorphism UI toolkit with frosted glass containers, blur effects, glass buttons, transparent dialogs, and animated gradients.

Flutter Dart License

✨ Features

✅ Frosted glass containers ✅ Blur navigation bars ✅ Glass buttons ✅ Transparent dialogs ✅ Animated glass gradients ✅ Smooth modern UI ✅ Highly customizable ✅ Lightweight and reusable

📦 Installation

Add this to your pubspec.yaml:

dependencies:
  zeba_academy_glassmorphism: ^0.0.1

Run:

flutter pub get

🚀 Import

import 'package:zeba_academy_glassmorphism/zeba_academy_glassmorphism.dart';

🧊 Glass Container

Create beautiful frosted glass UI components.

GlassContainer(
  width: 300,
  padding: const EdgeInsets.all(20),
  child: const Text(
    'Glassmorphism UI',
    style: TextStyle(
      color: Colors.white,
      fontSize: 24,
    ),
  ),
)

🔘 Glass Button

Modern animated glass button.

GlassButton(
  onTap: () {
    debugPrint('Tapped!');
  },
  child: const Text(
    'Tap Me',
    style: TextStyle(
      color: Colors.white,
      fontWeight: FontWeight.bold,
    ),
  ),
)

📱 Glass Navigation Bar

Blurred navigation bar with glass effects.

GlassNavBar(
  items: const [
    Icon(Icons.home, color: Colors.white),
    Icon(Icons.search, color: Colors.white),
    Icon(Icons.favorite, color: Colors.white),
    Icon(Icons.person, color: Colors.white),
  ],
)

💬 Glass Dialog

Transparent glass-style dialogs.

showDialog(
  context: context,
  builder: (_) {
    return const GlassDialog(
      child: Text(
        'Beautiful Glass Dialog',
        style: TextStyle(color: Colors.white),
      ),
    );
  },
);

🌈 Animated Glass Gradient

Animated colorful glass background.

AnimatedGlassGradient(
  child: YourWidget(),
)

🖼 Full Example

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

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: const GlassDemoPage(),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: AnimatedGlassGradient(
        child: Center(
          child: GlassContainer(
            width: 320,
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: [
                const Icon(
                  Icons.blur_on,
                  size: 80,
                  color: Colors.white,
                ),

                const SizedBox(height: 20),

                const Text(
                  'Zeba Academy',
                  style: TextStyle(
                    fontSize: 28,
                    fontWeight: FontWeight.bold,
                    color: Colors.white,
                  ),
                ),

                const SizedBox(height: 12),

                GlassButton(
                  onTap: () {},
                  child: const Text(
                    'Get Started',
                    style: TextStyle(
                      color: Colors.white,
                    ),
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

📂 Package Structure

lib/
│
├── zeba_academy_glassmorphism.dart
│
├── src/
│   ├── glass_container.dart
│   ├── glass_button.dart
│   ├── glass_navbar.dart
│   ├── glass_dialog.dart
│   └── animated_glass_gradient.dart

🎯 Use Cases

  • Modern fintech apps
  • Dashboard interfaces
  • Portfolio applications
  • Gaming UI
  • Music apps
  • Glassmorphism themed apps
  • Beautiful onboarding screens

🔥 Upcoming Features

  • Glass cards
  • Liquid glass effects
  • Hover animations
  • Neon glow widgets
  • Dynamic blur intensity
  • Glass app bars
  • Theme presets
  • Dark/light adaptive glass

🤝 Contributing

Contributions are welcome!

Feel free to submit issues, feature requests, and pull requests.

📄 License

This project is licensed under the GPL License.

## About Me

✨ I’m Sufyan bin Uzayr, an open-source developer passionate about building and sharing meaningful projects.

You can learn more about me and my work at sufyanism.com or connect with me on Linkedin

## Your all-in-one learning hub!

🚀 Explore courses and resources in coding, tech, and development at zeba.academy and code.zeba.academy.

Empower yourself with practical skills through curated tutorials, real-world projects, and hands-on experience.

Level up your tech game today! 💻✨

Zeba Academy is a learning platform dedicated to coding, technology, and development.

➡ Visit our main site: https://zeba.academy ➡ Explore hands-on courses and resources at: https://code.zeba.academy ➡ Check out our YouTube for more tutorials: https://www.youtube.com/@zeba.academy ➡ Follow us on Instagram: https://www.instagram.com/zeba.academy/

❤️ Support

If you like this package, give it a ⭐ on GitHub and share it with the Flutter community!

Thank you for visiting!

Libraries

zeba_academy_glassmorphism