Flutter widgets for creating customizable neumorphic container and text primitives.
Clay Containers is a Flutter package that provides customizable container and text widgets for implementing neumorphic UI designs. It solves the problem of creating modern, soft-shadow interfaces by offering primitives with adjustable depth, spread, and curvature effects. Developers can use these widgets as building blocks for unique visual designs in their Flutter applications.
Flutter developers building mobile or desktop applications with modern neumorphic UI designs. It's particularly useful for designers and developers who want to implement custom visual styles beyond Material Design.
Developers choose Clay Containers because it provides specialized neumorphic widgets that integrate seamlessly with Flutter's widget tree while offering extensive customization options. Unlike generic container widgets, it includes built-in support for emboss/deboss effects, concave/convex surfaces, and animated transitions specifically for neumorphic designs.
Neumorphic containers and text widget primitives to serve as the foundation of your own unique neumorphic designs.
Open-Awesome is built by the community, for the community. Submit a project, suggest an awesome list, or help improve the catalog on GitHub.
Allows fine-tuning of depth, spread, emboss/deboss states, and concave/convex curves, as shown in the README examples with adjustable parameters like depth: 40 and spread: 40.
Widgets like ClayContainer and ClayText behave similarly to Flutter's native Container and Text, making them easy to adopt in existing widget trees without breaking composition patterns.
ClayTheme and ClayThemeData enable consistent neumorphic styling across the app, with inheritance and override capabilities as demonstrated in the theming section, allowing centralized control.
ClayAnimatedContainer provides smooth transitions between neumorphic states, integrating with Flutter's animation system for effects like depth changes without extra setup, as shown in the animated GIF example.
For optimal neumorphic effects, the background color of parent widgets must match the container color, adding setup complexity and potential for visual bugs if not handled carefully, as noted in the README.
Only includes container and text primitives; lacks other common UI components like buttons or sliders, which forces developers to build these themselves, increasing development time.
The README doesn't mention accessibility considerations, such as contrast ratios or screen reader support, which could lead to usability issues in inclusive design scenarios.