| # Flutter ![Flutter logo][] | 
 |  | 
 | [![Gitter Channel][]][Gitter badge] | 
 | [![Build Status - Cirrus][]][Build status] | 
 |  | 
 | # Build beautiful native apps in record time | 
 |  | 
 | Flutter is Google’s mobile app SDK for crafting high-quality native interfaces on iOS and Android in record time. Flutter works with existing code, is used by developers and organizations around the world, and is free and open source. | 
 |  | 
 | ### Documentation | 
 |  | 
 | **Main site: [flutter.io][]** | 
 | * [Install](https://flutter.io/get-started/install/) | 
 | * [Get started](https://flutter.io/get-started/) | 
 | * [API documentation](https://docs.flutter.io/) | 
 | * [Changelog](https://github.com/flutter/flutter/wiki/Changelog) | 
 | * [How to contribute](https://github.com/flutter/flutter/blob/master/CONTRIBUTING.md) | 
 |  | 
 | For announcements about new releases and breaking changes, follow the | 
 | [flutter-announce@googlegroups.com](https://groups.google.com/forum/#!forum/flutter-announce) | 
 | mailing list. | 
 |  | 
 | ## Fast development | 
 |  | 
 | Flutter's <em>hot reload</em> helps you quickly | 
 | and easily experiment, build UIs, add features, and fix | 
 | bugs. Experience sub-second reload times, | 
 | without losing state, on | 
 | emulators, simulators, and hardware for iOS | 
 | and Android. | 
 |  | 
 | <img src="https://raw.githubusercontent.com/flutter/website/master/src/_assets/image/tools/android-studio/hot-reload.gif" alt="Make a change in your code, and your app changes instantly."> | 
 |  | 
 | ## Expressive and flexible UI | 
 | Quickly ship features with a focus on native end-user experiences. | 
 | Layered architecture allows full customization, which results in incredibly | 
 | fast rendering and expressive and flexible designs. | 
 |  | 
 | Delight your users with Flutter's built-in | 
 | beautiful Material Design and | 
 | Cupertino (iOS-flavor) widgets, rich motion APIs, | 
 | smooth natural scrolling, and platform awareness. | 
 |  | 
 | [<img src="https://github.com/flutter/website/blob/master/src/images/homepage/screenshot-1.png" width="270" height="480" alt="Brand-first shopping design" align="left">](https://github.com/flutter/flutter/tree/master/examples/flutter_gallery/lib/demo/animation) | 
 | [<img src="https://github.com/flutter/website/blob/master/src/images/homepage/screenshot-2.png" width="270" height="480" alt="Fitness app design">](https://github.com/flutter/posse_gallery) | 
 |  | 
 | [<img src="https://github.com/flutter/website/blob/master/src/images/homepage/screenshot-3.png" width="270" height="480" alt="Contact app design" align="left">](https://github.com/flutter/flutter/blob/master/examples/flutter_gallery/lib/demo/contacts_demo.dart) | 
 | [<img src="https://github.com/flutter/website/blob/master/src/images/homepage/ios-friendlychat.png" width="270" height="480" alt="iOS chat app design">](https://codelabs.developers.google.com/codelabs/flutter/) | 
 |  | 
 | Browse the <a href="https://flutter.io/widgets/">widget catalog</a>. | 
 |  | 
 | ## Modern, reactive framework | 
 |  | 
 | Easily compose your UI with Flutter's | 
 | modern functional-reactive framework and | 
 | rich set of platform, layout, and foundation widgets. | 
 | Solve your tough UI challenges with | 
 | powerful and flexible APIs for 2D, animation, gestures, | 
 | effects, and more. | 
 |  | 
 | ```dart | 
 | class CounterState extends State<Counter> { | 
 |   int counter = 0; | 
 |  | 
 |   void increment() { | 
 |     // Tells the Flutter framework that state has changed, | 
 |     // so the framework can run build() and update the display. | 
 |     setState(() { | 
 |       counter++; | 
 |     }); | 
 |   } | 
 |  | 
 |   Widget build(BuildContext context) { | 
 |     // This method is rerun every time setState is called. | 
 |     // The Flutter framework has been optimized to make rerunning | 
 |     // build methods fast, so that you can just rebuild anything that | 
 |     // needs updating rather than having to individually change | 
 |     // instances of widgets. | 
 |     return Row( | 
 |       children: <Widget>[ | 
 |         RaisedButton( | 
 |           onPressed: increment, | 
 |           child: Text('Increment'), | 
 |         ), | 
 |         Text('Count: $counter'), | 
 |       ], | 
 |     ); | 
 |   } | 
 | } | 
 | ``` | 
 |  | 
 | Browse the <a href="https://flutter.io/widgets/">widget catalog</a> | 
 | and learn more about the | 
 | <a href="https://flutter.io/widgets-intro/">functional-reactive framework</a>. | 
 |  | 
 | ## Access native features and SDKs | 
 |  | 
 | Make your app come to life | 
 | with platform APIs, 3rd party SDKs, | 
 | and native code. | 
 | Flutter lets you reuse your existing Java/Kotlin and ObjC/Swift code, | 
 | and access native features and SDKs on Android and iOS. | 
 |  | 
 | Accessing platform features is easy. Here is a snippet from our <a href="https://github.com/flutter/flutter/tree/master/examples/platform_channel">interop example</a>: | 
 |  | 
 | ```dart | 
 | Future<void> getBatteryLevel() async { | 
 |   var batteryLevel = 'unknown'; | 
 |   try { | 
 |     int result = await methodChannel.invokeMethod('getBatteryLevel'); | 
 |     batteryLevel = 'Battery level: $result%'; | 
 |   } on PlatformException { | 
 |     batteryLevel = 'Failed to get battery level.'; | 
 |   } | 
 |   setState(() { | 
 |     _batteryLevel = batteryLevel; | 
 |   }); | 
 | } | 
 | ``` | 
 |  | 
 | Learn how to use <a href="https://flutter.io/using-packages/">packages</a> or | 
 | write <a href="https://flutter.io/platform-channels/">platform channels</a> | 
 | to access native code, APIs, and SDKs. | 
 |  | 
 | ## Unified app development | 
 |  | 
 | Flutter has the tools and libraries to help you easily | 
 | bring your ideas to life on iOS and Android. | 
 | If you don't have any mobile development experience, Flutter | 
 | is an easy and fast way to build beautiful mobile apps. | 
 | If you are an experienced iOS or Android developer, | 
 | you can use Flutter for your views and leverage much of your | 
 | existing Java/Kotlin/ObjC/Swift investment. | 
 |  | 
 | Learn more about what makes Flutter special in the | 
 | <a href="https://flutter.io/technical-overview/">technical overview</a>. | 
 |  | 
 | # More resources | 
 |  | 
 | Join us in our [Gitter chat room](https://gitter.im/flutter/flutter) or join our public mailing list, | 
 | [flutter-dev@googlegroups.com](https://groups.google.com/forum/#!forum/flutter-dev). | 
 |  | 
 | # How to contribute | 
 |  | 
 | To join the team working on Flutter, see our [contributor guide](CONTRIBUTING.md). | 
 |  | 
 | [Build Status - Cirrus]: https://api.cirrus-ci.com/github/flutter/flutter.svg | 
 | [Build status]: https://cirrus-ci.com/github/flutter/flutter/master | 
 | [flutter.io]: https://flutter.io | 
 | [Flutter logo]: https://github.com/dart-lang/site-shared/blob/master/src/_assets/image/flutter/icon/64.png?raw=1 | 
 | [Gitter Channel]: https://badges.gitter.im/flutter/flutter.svg | 
 | [Gitter badge]: https://gitter.im/flutter/flutter?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge |