quick_shadow #

A Flutter package that adds inner shadow support to any widget — Container, Button, Card, and more.

Flutter's built-in BoxDecoration only supports outer shadows. This package fills that gap with a simple, performant QuickShadow widget using a Canvas-based even-odd path technique.

Features #

• ✅ Inner shadow on any widget
• ✅ Supports BorderRadius (rounded corners & circles)
• ✅ Multiple shadows on a single widget
• ✅ Perfect for Neumorphism UI
• ✅ QuickShadowContainer convenience widget
• ✅ Zero external dependencies (pure Flutter)

Getting Started #

Add to your pubspec.yaml:

dependencies:
  quick_shadow: ^0.0.1

Run:

flutter pub get

Then import in your Dart file:

import 'package:quick_shadow/quick_shadow.dart';

Usage #

Basic Inner Shadow #

QuickShadow(
  shadows: [
    Shadow(
      color: Colors.black38,
      blurRadius: 10,
      offset: Offset(4, 4),
    ),
  ],
  borderRadius: BorderRadius.circular(16),
  child: Container(
    width: 150,
    height: 150,
    decoration: BoxDecoration(
      color: Color(0xFFE0E0E0),
      borderRadius: BorderRadius.circular(16),
    ),
  ),
)

Neumorphism — Pressed Effect #

QuickShadow(
  shadows: [
    Shadow(color: Colors.black26, blurRadius: 12, offset: Offset(6, 6)),
    Shadow(color: Colors.white70, blurRadius: 12, offset: Offset(-6, -6)),
  ],
  borderRadius: BorderRadius.circular(20),
  child: Container(
    width: 160,
    height: 60,
    decoration: BoxDecoration(
      color: Color(0xFFE0E5EC),
      borderRadius: BorderRadius.circular(20),
    ),
    alignment: Alignment.center,
    child: Text('PRESSED'),
  ),
)

QuickShadowContainer (Shorthand) #

QuickShadowContainer(
  width: 200,
  height: 60,
  decoration: BoxDecoration(
    color: Color(0xFFE0E5EC),
    borderRadius: BorderRadius.circular(14),
  ),
  shadows: [
    Shadow(
      color: Colors.black26,
      blurRadius: 10,
      offset: Offset(4, 4),
    ),
  ],
  alignment: Alignment.center,
  child: Text('Hello Inner Shadow'),
)

Circular Shape #

QuickShadow(
  shadows: [
    Shadow(color: Colors.black26, blurRadius: 14, offset: Offset(6, 6)),
  ],
  borderRadius: BorderRadius.circular(75),
  child: Container(
    width: 150,
    height: 150,
    decoration: BoxDecoration(
      color: Color(0xFFE0E5EC),
      shape: BoxShape.circle,
    ),
  ),
)

API Reference #

QuickShadow #

QuickShadowContainer #

How Shadow Offset Works #

Contributing #

Found a bug or want a new feature? Open an issue or PR at GitHub — contributions are welcome!

License #

MIT License — see LICENSE file for details.