zeba_academy_isometric #

A modern Flutter package for building beautiful 3D isometric UI, floating depth effects, perspective transforms, and layered animations with ease.

Create immersive interfaces with elegant motion and smooth depth illusions for mobile, web, and desktop Flutter apps.

✨ Features #

✅ 3D illusion cards ✅ Floating depth widgets ✅ Perspective transforms ✅ Layered UI animations ✅ Smooth interactive effects ✅ Lightweight & customizable ✅ Flutter Web support ✅ Modern UI experience

📦 Installation #

Add dependency inside your pubspec.yaml:

dependencies:
  zeba_academy_isometric: ^0.0.1

Then run:

flutter pub get

🚀 Import #

import 'package:zeba_academy_isometric/zeba_academy_isometric.dart';

🧩 Widgets Included #

🎨 ZebaIsometricCard #

Create stunning isometric-style cards with perspective depth.

ZebaIsometricCard(
  child: Container(
    color: Colors.deepPurple,
    child: const Center(
      child: Text(
        'Zeba Academy',
        style: TextStyle(
          color: Colors.white,
          fontSize: 24,
          fontWeight: FontWeight.bold,
        ),
      ),
    ),
  ),
)

🌊 ZebaFloatingWidget #

Add floating motion to any widget.

ZebaFloatingWidget(
  child: Container(
    height: 80,
    width: 80,
    decoration: BoxDecoration(
      color: Colors.cyan,
      borderRadius: BorderRadius.circular(20),
    ),
  ),
)

🔄 ZebaPerspective #

Apply custom 3D perspective transforms.

ZebaPerspective(
  rotateX: 10,
  rotateY: -10,
  child: Container(
    height: 120,
    width: 120,
    color: Colors.orange,
  ),
)

🪄 ZebaLayeredAnimation #

Build layered depth animations easily.

ZebaLayeredAnimation(
  layers: [
    Container(
      height: 120,
      width: 120,
      color: Colors.purple,
    ),
    Container(
      height: 90,
      width: 90,
      color: Colors.white,
    ),
  ],
)

📱 Complete Example #

import 'package:flutter/material.dart';
import 'package:zeba_academy_isometric/zeba_academy_isometric.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(
        backgroundColor: const Color(0xff0F172A),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              ZebaIsometricCard(
                child: Container(
                  color: Colors.deepPurple,
                  child: const Center(
                    child: Text(
                      'Zeba Academy',
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 28,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                  ),
                ),
              ),

              const SizedBox(height: 60),

              ZebaFloatingWidget(
                child: Container(
                  height: 80,
                  width: 80,
                  decoration: BoxDecoration(
                    color: Colors.cyan,
                    borderRadius: BorderRadius.circular(20),
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

⚙️ Customization #

All widgets are highly customizable.

Example:

ZebaIsometricCard(
  rotateX: 15,
  rotateY: -15,
  duration: Duration(milliseconds: 500),
  shadowColor: Colors.black54,
  borderRadius: BorderRadius.circular(32),
  child: YourWidget(),
)

🌐 Platform Support #

📁 Package Structure #

lib/
│
├── zeba_academy_isometric.dart
│
└── src/
    ├── cards/
    ├── floating/
    ├── perspective/
    ├── layered/
    └── utils/

🧪 Running Tests #

flutter test

📌 Roadmap #

Upcoming features:

• Interactive tilt detection
• Gyroscope support
• Advanced parallax layers
• Physics-based animations
• Dynamic lighting effects
• Gesture-driven depth system

🤝 Contributing #

Contributions are welcome!

Feel free to:

• Open issues
• Suggest features
• Submit 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.

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

💻 Level up your tech journey today!

➡ Main Website: https://zeba.academy ➡ Coding Platform: https://code.zeba.academy ➡ YouTube: https://www.youtube.com/@zeba.academy ➡ Instagram: https://www.instagram.com/zeba.academy/

❤️ Support #

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

🔥 Built with Flutter & Passion by Zeba Academy #