zeba_academy_glass

pub package License: GPL-3.0 Flutter

A beautiful, lightweight, and customizable Glassmorphism UI package for Flutter.

Create stunning frosted glass interfaces with reusable widgets including glass containers, cards, buttons, blur effects, and customizable borders.

✨ Features

  • ✅ Glass Containers
  • ✅ Glass Cards
  • ✅ Glass Buttons
  • ✅ Frosted Blur Effects
  • ✅ Multiple Glass Border Styles
  • ✅ Custom Borders
  • ✅ Gradient Background Support
  • ✅ Custom Colors
  • ✅ Configurable Blur Intensity
  • ✅ Configurable Opacity
  • ✅ Rounded Corners
  • ✅ Box Shadow Support
  • ✅ Lightweight
  • ✅ Null Safety
  • ✅ Material 3 Ready
  • ✅ Cross Platform

Supports:

  • Android
  • iOS
  • Web
  • Windows
  • macOS
  • Linux

Installation

Add the package to your pubspec.yaml.

dependencies:
  zeba_academy_glass: ^1.0.0

Install the package.

flutter pub get

Import

import 'package:zeba_academy_glass/zeba_academy_glass.dart';

GlassContainer

GlassContainer(
  child: const Text(
    'Glass Container',
    style: TextStyle(color: Colors.white),
  ),
)

Glass Card

GlassCard(
  child: Padding(
    padding: EdgeInsets.all(20),
    child: Text(
      'Glass Card',
      style: TextStyle(color: Colors.white),
    ),
  ),
)

Glass Button

GlassButton(
  onPressed: () {},
  child: const Text(
    'Login',
    style: TextStyle(color: Colors.white),
  ),
)

Blur Layer

BlurLayer(
  sigma: 20,
  child: Image.asset(
    'assets/background.jpg',
    fit: BoxFit.cover,
  ),
)

Border Styles

Normal

GlassContainer(
  glassBorderStyle: GlassBorderStyle.normal,
  child: const Text("Normal"),
)

Thin

GlassContainer(
  glassBorderStyle: GlassBorderStyle.thin,
  child: const Text("Thin"),
)

Thick

GlassContainer(
  glassBorderStyle: GlassBorderStyle.thick,
  child: const Text("Thick"),
)

Highlighted

GlassContainer(
  glassBorderStyle: GlassBorderStyle.highlighted,
  child: const Text("Premium"),
)

No Border

GlassContainer(
  glassBorderStyle: GlassBorderStyle.none,
  child: const Text("Borderless"),
)

Custom Border

GlassContainer(
  border: Border.all(
    color: Colors.blue,
    width: 2,
  ),
  child: const Text("Custom"),
)

Gradient Glass

GlassContainer(
  gradient: const LinearGradient(
    colors: [
      Colors.white24,
      Colors.blueAccent,
    ],
  ),
  child: const Text(
    "Gradient Glass",
    style: TextStyle(color: Colors.white),
  ),
)

Complete Example

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

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Stack(
          fit: StackFit.expand,
          children: [
            Image.network(
              'https://picsum.photos/1200',
              fit: BoxFit.cover,
            ),
            Center(
              child: GlassContainer(
                blur: 25,
                opacity: .18,
                glassBorderStyle: GlassBorderStyle.highlighted,
                child: Column(
                  mainAxisSize: MainAxisSize.min,
                  children: [
                    const Text(
                      'Welcome',
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 28,
                      ),
                    ),
                    const SizedBox(height: 20),
                    GlassButton(
                      onPressed: () {},
                      child: const Text(
                        'Continue',
                        style: TextStyle(color: Colors.white),
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

API Overview

Widget Description
GlassContainer Reusable glassmorphism container
GlassCard Glass styled card
GlassButton Glass button
BlurLayer Background blur widget
GlassBorder Utility for creating glass borders

Platform Support

Platform Supported
Android ✅
iOS ✅
Web ✅
Windows ✅
macOS ✅
Linux ✅

Performance

  • Optimized widget tree
  • Lightweight implementation
  • No unnecessary dependencies
  • Customizable blur intensity
  • Efficient rendering
  • Production ready

License

This project is licensed under the GNU General Public License v3.0 (GPL-3.0).

See the LICENSE file for complete license details.

About Me

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

Learn more about my work:

Your all-in-one learning hub!

🚀 Explore courses and resources in coding, tech, and development at Zeba Academy.

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

Resources

Contributing

Contributions, bug reports, feature requests, and pull requests are welcome.

If you find this package useful, consider giving it a ⭐ on GitHub.

Support

If you encounter any issues or have suggestions, please open an issue in the GitHub repository.

Made with ❤️ using Flutter.

Thank you for visiting!

Libraries

zeba_academy_glass