Have you seen Flutter? It’s Google’s UI framework for building cross-platform apps. You write Flutter apps in the modern programming language Dart. Flutter packages bring app development to life fast. Flutter apps compile to honest-to-god native apps for iOS and Android and a web app and a desktop app.

There have been plenty of other frameworks for building cross-platform apps in the past, but they’ve all kind of faked it in one way or another. Faking it meaning wrapping things in a web view or some other not-actually-native way of doing things. By being truly native, you get the speed and feel of the native platform.

To be clear, you can’t compile to native platforms right here on CodePen. Our integration compiles Flutter apps to web apps you can use to learn the Flutter SDK and share anywhere on the web. You can still take code from here and use it in real projects though, of course, as public Pens on CodePen are MIT licensed.

I can see how the appeal of Flutter is extremely high for lots of companies that want their product to be everywhere, but find it hard to stomach having lots of different product teams and the struggles and costs of all that. Heck, just on the web, we used to commonly see mobile-specific teams and we’re still basking in the glory of not having to do that any more thanks to responsive web design. I’m not alone in seeing the appeal, Flutter is going on 90,000 stars on GitHub!

This is a Custom Pen Editor

The Flutter Editor on CodePen is custom built just for Flutter. This isn’t our regular Pen Editor. Pretty cool, we think. It will still look and feel like the CodePen you are used to.

You have all the regular features of CodePen, like the ability to save and come back to Pens later, make them private (if you’re PRO), log things to the console, upload assets, and all that. These are still Pens in that they live in the regular CodePen ecosystem.

You can even embed them like normal!

CodePen Embed Fallback

I hope you can see the potential of all this. Much more to come!

A Couple Things to Know about Flutter

  • Google’s Material Components are built right in, giving you access to useful widgets and smooth animations and transitions across all platforms.
  • You work with Flutter in Dart, Google’s language that not only can compile to JavaScript for the web, but has compilers for all the other major platforms.
  • Everything about Flutter is free. It’s an open-source framework anyone can use to build apps. Check out their showcase of products using it.