Little Flowkit Flows

Had fun making these little guys to show off a few of the symbols in action.

The animation is done by adding a class name to the dashed svg code and animating with CSS like this:

animation: strokeDance 5s infinite ease-in-out

@keyframes strokeDance
0%, 100%
stroke-dashoffset: 0
stroke-dashoffset: 240

You can see it all in action at


Posted on Nov 17, 2017
Teaching interface design at Shift Nudge

More by MDS

View profile