Flutter Avatars – Bottts
There is absolutely no denying it: having your own avatar is freakin’ great! Any app or user experience that includes a fun digital avatar maker is almost always 10x more enjoyable.
That’s why we’re stoked to implement a Flutter Widget to render Bottts svg avatars on android/ios. Certainly, this is a high-performance Flutter Widget for users.
It is faster than other traditional approaches because it does not use any API and instead renders SVG strings on the fly!


Bottts :
Characters Originally Designed by PabloStanley, the Sketch library can be found on bottts.com.
Getting Started
- Create Bottt object:
// Create Bottt with default constructor
var _bottt = Bottt(
color: Colors.red,
eye: EyeType.Glow,
face: FaceType.Square03,
mouth: MouthType.Bite,
side: SideType.Round,
texture: TextureType.Dirty01,
top: TopType.Horns,
);
// Randomize all properties
var _bottt = Bottt.random();
// Or keep some properties specific & remaining as random
var _bottt = Bottt.random(
top: TopType.Horns,
mouth: MouthType.Bite,
);
- Create BotttAvatar widget and pass it the bottt object:
Padding(
padding: EdgeInsets.all(20),
child: BotttAvatar(_bottt),
)
// Alternatively you can also combine the widget with a CircleAvatar
CircleAvatar(
radius: 90,
child: CircleAvatar(
radius: 85,
backgroundColor: Color.fromARGB(255, 100, 100, 100),
child: Padding(
padding: EdgeInsets.all(20),
child: BotttAvatar(_bottt),
),
),
)
For Maps: Use botttObject.toJson()
and Bottt.fromJson(serializedBotttString)
methods to serialize/deserialize bottts.
For Strings: Use botttObject.serialize()
and Bottt.deserialize()(serializedBotttString)
methods to serialize/deserialize bottts.
GitHub
https://github.com/AbhijatSaxena/flutter-avatars-bottts