CINXE.COM

<!DOCTYPE html><html xmlns:cc="http://creativecommons.org/ns#"><head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# medium-com: http://ogp.me/ns/fb/medium-com#"><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=contain"><title>Material Design – Flutter – Medium</title><link rel="canonical" href="https://medium.com/flutter/tagged/material-design"><link id="feedLink" rel="alternate" type="application/rss+xml" title="RSS" href="https://medium.com/feed/flutter/tagged/material-design"><meta name="robots" content="index,follow"><meta name="title" content="Material Design – Flutter – Medium"><meta name="referrer" content="unsafe-url"><meta name="description" content="Read writing about Material Design in Flutter. Flutter is Google's UI framework for crafting high-quality native interfaces on iOS, Android, web, and desktop. Flutter works with existing code, is used by developers and organizations around the world, and is free and open source. Learn more at https://flutter.dev."><meta name="theme-color" content="#000000"><meta property="og:title" content="Material Design – Flutter – Medium"><meta property="twitter:title" content="Material Design – Flutter – Medium"><meta property="og:url" content="https://medium.com/flutter/tagged/material-design"><meta property="fb:app_id" content="542599432471018"><meta property="og:description" content="Read writing about Material Design in Flutter. Flutter is Google's UI framework for crafting high-quality native interfaces on iOS, Android, web, and desktop. Flutter works with existing code, is used by developers and organizations around the world, and is free and open source. Learn more at https://flutter.dev."><meta name="twitter:description" content="Read writing about Material Design in Flutter. Flutter is Google's UI framework for crafting high-quality native interfaces on iOS, Android, web, and desktop. Flutter works with existing code, is used by developers and organizations around the world, and is free and open source. Learn more at https://flutter.dev."><meta name="twitter:image:src" content=""><meta property="og:type" content="medium-com:collection"><meta name="twitter:card" content="summary_large_image"><meta name="twitter:site" content="@Medium"><meta property="og:site_name" content="Medium"><meta name="twitter:app:name:iphone" content="Medium"><meta name="twitter:app:id:iphone" content="828256236"><meta name="twitter:app:url:iphone" content="medium://flutter/tagged/material-design"><meta property="al:ios:app_name" content="Medium"><meta property="al:ios:app_store_id" content="828256236"><meta property="al:android:package" content="com.medium.reader"><meta property="al:android:app_name" content="Medium"><meta property="al:ios:url" content="medium://flutter/tagged/material-design"><meta property="al:android:url" content="medium://flutter/tagged/material-design"><meta property="al:web:url" content="https://medium.com/flutter/tagged/material-design"><link rel="search" type="application/opensearchdescription+xml" title="Medium" href="/osd.xml" /><link rel="alternate" href="android-app://com.medium.reader/https/medium.com/flutter/tagged/material-design" /><link rel="stylesheet" href="https://cdn-static-1.medium.com/_/fp/css/main-branding-base.ouwh4uMviI3QQWIjxRhkHA.12.css"><script>!function(n,e){var t,o,i,c=[],f={passive:!0,capture:!0},r=new Date,a="pointerup",u="pointercancel";function p(n,c){t||(t=c,o=n,i=new Date,w(e),s())}function s(){o>=0&&o<i-r&&(c.forEach(function(n){n(o,t)}),c=[])}function l(t){if(t.cancelable){var o=(t.timeStamp>1e12?new Date:performance.now())-t.timeStamp;"pointerdown"==t.type?function(t,o){function i(){p(t,o),r()}function c(){r()}function r(){e(a,i,f),e(u,c,f)}n(a,i,f),n(u,c,f)}(o,t):p(o,t)}}function w(n){["click","mousedown","keydown","touchstart","pointerdown"].forEach(function(e){n(e,l,f)})}w(n),self.perfMetrics=self.perfMetrics||{},self.perfMetrics.onFirstInputDelay=function(n){c.push(n),s()}}(addEventListener,removeEventListener);</script><script>document.domain = document.domain;</script><script>if (window.top !== window.self) window.location = 'about:blank';var OB_startTime = new Date().getTime(); var OB_loadErrors = []; function _onerror(e) { OB_loadErrors.push(e) }; if (document.addEventListener) document.addEventListener("error", _onerror, true); else if (document.attachEvent) document.attachEvent("onerror", _onerror); function _asyncScript(u) {var d = document, f = d.getElementsByTagName("script")[0], s = d.createElement("script"); s.type = "text/javascript"; s.async = true; s.src = u; f.parentNode.insertBefore(s, f);}function _asyncStyles(u) {var d = document, f = d.getElementsByTagName("script")[0], s = d.createElement("link"); s.rel = "stylesheet"; s.href = u; f.parentNode.insertBefore(s, f); return s}(new Image()).src = "/_/stat?event=pixel.load&origin=" + encodeURIComponent(location.origin);</script><script>window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date; ga("create", "G-7JY7T788PK", "auto", {"allowLinker": true, "legacyCookieDomain": window.location.hostname});ga("send", "pageview");</script><script async src="https://www.google-analytics.com/analytics.js"></script><script>(function () {var height = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight; var width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; document.write("<style>section.section-image--fullBleed.is-backgrounded {padding-top: " + Math.round(1.1 * height) + "px;}section.section-image--fullScreen.is-backgrounded, section.section-image--coverFade.is-backgrounded {min-height: " + height + "px; padding-top: " + Math.round(0.5 * height) + "px;}.u-height100vh {height: " + height + "px !important;}.u-height110vh {height: " + Math.round(1.1 * height) + "px !important;}.u-minHeight100vh {min-height: " + height + "px !important;}.u-maxHeight100vh {max-height: " + height + "px !important;}section.section-image--coverFade {height: " + height + "px;}.section-aspectRatioViewportPlaceholder, .section-aspectRatioViewportCropPlaceholder {max-height: " + height + "px;}.section-aspectRatioViewportBottomSpacer, .section-aspectRatioViewportBottomPlaceholder {max-height: " + Math.round(0.5 * height) + "px;}.zoomable:before {top: " + (-1 * height) + "px; left: " + (-1 * width) + "px; padding: " + height + "px " + width + "px;}</style>");})()</script><link rel="icon" href="https://miro.medium.com/v2/5d8de952517e8160e40ef9841c781cdc14a5db313057fa3c3de41c6f5b494b19" class="js-favicon"><link rel="apple-touch-icon" sizes="152x152" href="https://cdn-images-1.medium.com/fit/c/304/304/1*5-aoK8IBmXve5whBQM90GA.png"><link rel="apple-touch-icon" sizes="120x120" href="https://cdn-images-1.medium.com/fit/c/240/240/1*5-aoK8IBmXve5whBQM90GA.png"><link rel="apple-touch-icon" sizes="76x76" href="https://cdn-images-1.medium.com/fit/c/152/152/1*5-aoK8IBmXve5whBQM90GA.png"><link rel="apple-touch-icon" sizes="60x60" href="https://cdn-images-1.medium.com/fit/c/120/120/1*5-aoK8IBmXve5whBQM90GA.png"><link rel="mask-icon" href="https://cdn-static-1.medium.com/_/fp/icons/monogram-mask.KPLCSFEZviQN0jQ7veN2RQ.12.svg" color="#171717"></head><body itemscope class=" browser-ie os-windows v-unbound v-glyph v-glyph--m2-unbound-source-serif-pro is-noJs"><script>document.body.className = document.body.className.replace(/(^|\s)is-noJs(\s|$)/, "$1is-js$2")</script><div class="site-main" id="container"><div class="butterBar butterBar--error"></div><div class="surface"><div id="prerendered" class="screenContent"><div class="metabar u-clearfix u-boxShadow4px12pxBlackLighter u-textColorTransparentWhiteDarker js-metabar"><div class="branch-journeys-top"></div><div class="js-metabarMiddle metabar-inner u-marginAuto u-maxWidth1032 u-flexCenter u-justifyContentSpaceBetween u-height65 u-xs-height56 u-paddingHorizontal20"><div class="metabar-block u-flex1 u-flexCenter"><div class="js-metabarLogoLeft"><a href="https://medium.com/" data-log-event="home" class="siteNav-logo u-fillBlack u-flex0 u-flexCenter u-paddingTop0"><span class="svgIcon svgIcon--wordmarkMedium svgIcon--120x26px u-flex"><svg class="svgIcon-use" width="120" height="26" ><path d="M29.57 1.404l.036-.008V1.12h-7.27l-6.75 15.979-6.75-15.98H1.003v.278l.035.008c1.327.302 2 .752 2 2.374v18.993c0 1.623-.676 2.073-2.003 2.374L1 25.153v.279h5.315v-.278l-.035-.008c-1.327-.302-2-.751-2-2.374V4.88l8.67 20.552h.492l8.924-21.125V23.24c-.114 1.282-.782 1.677-1.983 1.95l-.036.009v.275h9.259V25.2l-.036-.008c-1.203-.274-1.886-.67-2-1.95l-.006-19.464h.006c0-1.622.674-2.072 2-2.374zm4.23 12.582c.15-3.412 1.367-5.875 3.41-5.918.629.01 1.157.219 1.568.62.872.852 1.282 2.634 1.219 5.298h-6.198zm-.092.962h10.85v-.046c-.03-2.61-.78-4.64-2.228-6.033-1.25-1.204-3.103-1.867-5.048-1.867h-.043c-1.01 0-2.248.246-3.13.693a7.316 7.316 0 00-2.623 2.086c-1.185 1.479-1.903 3.477-2.078 5.724a13.717 13.717 0 00-.04.755c-.004.195-.005.39-.001.587.117 5.087 2.846 9.153 7.692 9.153 4.254 0 6.73-3.132 7.348-7.336l-.312-.11c-1.085 2.259-3.034 3.628-5.252 3.461-3.028-.228-5.347-3.32-5.137-7.066m23.122 6.893c-.356.85-1.099 1.319-2.094 1.319-.995 0-1.905-.689-2.552-1.939-.694-1.342-1.06-3.24-1.06-5.487 0-4.678 1.445-7.704 3.68-7.704.937 0 1.674.468 2.026 1.284v12.527zm7.198 3.335c-1.327-.316-2-.787-2-2.492V0l-8.062 2.392v.293l.05-.004c1.111-.09 1.866.064 2.304.472.343.32.51.809.51 1.498v3.11C56.033 7.25 55.088 7 53.94 7c-2.326 0-4.453.987-5.986 2.779-1.599 1.867-2.444 4.42-2.444 7.38 0 5.287 2.584 8.84 6.43 8.84 2.25 0 4.06-1.242 4.888-3.336v2.811h7.233v-.29l-.035-.008zM70.94 3.085c0-1.65-1.236-2.896-2.875-2.896-1.632 0-2.908 1.272-2.908 2.896 0 1.624 1.278 2.896 2.908 2.896 1.64 0 2.875-1.245 2.875-2.896zm1.903 22.092c-1.327-.316-2-.787-2-2.492h-.006V7.055l-7.234 2.092v.284l.043.004c1.566.14 1.994.683 1.994 2.525v13.515h7.24v-.29l-.037-.008zm18.536 0c-1.327-.316-2-.787-2-2.492V7.055L82.49 9.078v.285l.04.004c1.28.136 1.65.71 1.65 2.56v9.88c-.426.85-1.227 1.356-2.196 1.39-1.573 0-2.439-1.07-2.439-3.012V7.055l-7.234 2.092v.284l.044.004c1.565.14 1.994.683 1.994 2.525v8.362a9.443 9.443 0 00.15 1.741l.13.57C75.243 24.845 76.848 26 79.362 26c2.129 0 3.996-1.328 4.818-3.405v2.885h7.233v-.291l-.034-.012zm28.102.298v-.291l-.035-.009c-1.44-.334-2.001-.964-2.001-2.248V12.295C117.445 8.98 115.597 7 112.5 7c-2.257 0-4.16 1.314-4.893 3.36-.582-2.168-2.257-3.36-4.734-3.36-2.175 0-3.88 1.156-4.612 3.11V7.056l-7.233 2.006v.286l.043.004c1.547.138 1.994.697 1.994 2.492v13.631h6.75v-.29l-.037-.01c-1.148-.271-1.519-.767-1.519-2.04V10.95c.304-.715.917-1.562 2.127-1.562 1.504 0 2.266 1.05 2.266 3.116v12.972h6.751v-.29l-.035-.01c-1.149-.271-1.52-.767-1.52-2.04V12.294a7.107 7.107 0 00-.095-1.21c.322-.777.97-1.696 2.23-1.696 1.524 0 2.265 1.02 2.265 3.116v12.972h7.233z"/></svg></span><span class="u-textScreenReader">Homepage</span></a></div><div class="u-paddingLeft10 u-sm-show r-paddingRight10"><a href="https://rsci.app.link/?%24canonical_url=https%3A%2F%2Fmedium.com/flutter%3F~feature=LoMobileNavBar&~channel=ShowCollectionHome&~stage=m2">Open in app</a></div></div><div class="metabar-block u-flex0 u-flexCenter"><div class="u-flexCenter u-height65 u-xs-height56"><div class="buttonSet buttonSet--wide u-lineHeightInherit"><a class="button button--primary button--chromeless u-accentColor--buttonNormal is-inSiteNavBar u-xs-hide js-signInButton" href="https://medium.com/m/signin?redirect=https%3A%2F%2Fmedium.com%2Fflutter%2Ftagged%2Fmaterial-design&source=--------------------------nav_reg&operation=login" data-action="sign-in-prompt" data-redirect="https://medium.com/flutter/tagged/material-design" data-action-source="--------------------------nav_reg">Sign in</a><a class="button button--primary button--withChrome u-accentColor--buttonNormal is-inSiteNavBar js-signUpButton" href="https://medium.com/m/signin?redirect=https%3A%2F%2Fmedium.com%2Fflutter%2Ftagged%2Fmaterial-design&source=--------------------------nav_reg&operation=register" data-action="sign-up-prompt" data-redirect="https://medium.com/flutter/tagged/material-design" data-action-source="--------------------------nav_reg">Get started</a></div></div></div></div><div class="u-tintBgColor u-tintSpectrum " ><div class="metabar-inner u-marginAuto u-maxWidth1032 u-paddingHorizontal20 js-metabarBottom"><nav role="navigation" class="metabar-block metabar-block--below u-flexCenter u-overflowHidden u-height54"><div class="u-flexCenter u-overflowHidden"><div class="u-marginRight40"><a href="https://medium.com/flutter?source=logo-lo_a41a4418babe---4da7dfd21a33" class="u-flexCenter js-collectionLogoOrName"><img height="36" width="137" src="https://cdn-images-1.medium.com/letterbox/274/72/50/50/1*KvnfbD1F5CzEsU9wSmRZyA.png?source=logoAvatar-lo_a41a4418babe---4da7dfd21a33" alt="Flutter" /></a></div><div class="u-overflowHidden u-xs-hide"><ul class="u-textAlignLeft u-noWrap u-overflowX u-height80 u-marginTop40 js-collectionNavItems"><li class="metabar-navItem js-collectionNavItem u-inlineBlock u-fontSize13 u-textUppercase u-letterSpacing1px u-textColorNormal u-xs-paddingRight12 u-xs-marginRight0 u-xs-paddingTop10"><a class="link link--darken u-accentColor--textDarken link--noUnderline u-baseColor--link js-navItemLink" href="https://medium.com/flutter/tagged/announcements">Announcements</a></li><li class="metabar-navItem js-collectionNavItem u-inlineBlock u-fontSize13 u-textUppercase u-letterSpacing1px u-textColorNormal u-xs-paddingRight12 u-xs-marginRight0 u-xs-paddingTop10"><a class="link link--darken u-accentColor--textDarken link--noUnderline u-baseColor--link js-navItemLink" href="https://medium.com/flutter/tagged/performance">Performance</a></li><li class="metabar-navItem js-collectionNavItem u-inlineBlock u-fontSize13 u-textUppercase u-letterSpacing1px u-textColorNormal u-xs-paddingRight12 u-xs-marginRight0 u-xs-paddingTop10"><a class="link link--darken u-accentColor--textDarken link--noUnderline u-baseColor--link js-navItemLink" href="https://medium.com/flutter/tagged/material-design">Material Design</a></li><li class="metabar-navItem js-collectionNavItem u-inlineBlock u-fontSize13 u-textUppercase u-letterSpacing1px u-textColorNormal u-xs-paddingRight12 u-xs-marginRight0 u-xs-paddingTop10"><a class="link link--darken u-accentColor--textDarken link--noUnderline u-baseColor--link js-navItemLink" href="https://medium.com/flutter/tagged/web-development">Web Development</a></li><span class="u-borderLeft1 u-baseColor--borderLight"></span><li class="metabar-navItem js-collectionNavItem is-external u-inlineBlock u-fontSize13 u-textUppercase u-letterSpacing1px u-textColorNormal u-xs-paddingRight12 u-xs-marginRight0 u-xs-paddingTop10"><a class="link link--darkenOnHover u-accentColor--textDarken link--noUnderline u-baseColor--link js-navItemLink" href="https://flutter.dev/" rel="nofollow noopener" target="_blank">flutter.dev</a></li></ul></div></div></nav></div></div></div><div class="metabar metabar--spacer js-metabarSpacer u-tintBgColor u-height119 u-xs-height110"></div><div class="container u-foreground u-maxWidth1032 u-paddingTop40"><div class="row u-relative"><div class="col u-size12of12"><div class="row"><div class="col u-size4of12 js-aboutCollectionBox"><header class="heading heading--page u-marginTop0 u-xs-marginTop20 u-sm-marginBottom5" ><div class="u-clearfix"><div class="heading-content u-floatLeft"><div class="heading-prefix">Tagged in</div><h1 class="heading-title heading-title--bold u-marginTop0 u-xs-marginTop20 u-sm-marginBottom5">Material Design</h1></div></div></header><div class="u-sm-hide"><div class="u-tableCell"><a class="link u-baseColor--link avatar avatar--roundedRectangle" href="https://medium.com/flutter" title="Go to Flutter" aria-label="Go to Flutter"><img src="https://cdn-images-1.medium.com/fit/c/72/72/1*5-aoK8IBmXve5whBQM90GA.png" class="avatar-image u-size36x36 u-xs-size32x32" alt="Flutter"></a></div><div class="u-tableCell u-verticalAlignMiddle u-textColorNormal u-fontSize16 u-breakWord u-paddingLeft10">Flutter</div><div class="u-fontSize14 u-lineHeightBaseSans u-textColorDark u-paddingTop15 u-paddingBottom15"><div class="u-marginBottom15 u-breakWord">Flutter is Google's UI framework for crafting high-quality native interfaces on iOS, Android, web, and desktop. Flutter works with existing code, is used by developers and organizations around the world, and is free and open source. Learn more at <a rel="nofollow" href="https://flutter.dev">https://flutter.dev</a></div><a class=" link--darken u-accentColor--textDarken link--accent u-accentColor--textNormal" href="https://medium.com/flutter/about">More information</a></div><div class="u-fontSize14 u-lineHeightBaseSans u-textColorDark u-paddingBottom15"><header class="heading heading--allCaps heading--light" ><div class="u-clearfix"><div class="heading-content u-floatLeft"><span class="heading-title">Followers</span></div></div></header>57K </div><div class="u-fontSize14 u-lineHeightBaseSans u-marginBottom4 u-paddingBottom15"><header class="heading heading--allCaps heading--light" ><div class="u-clearfix"><div class="heading-content u-floatLeft"><span class="heading-title">Elsewhere</span></div></div></header><div class="linkSet"><a class="button button--dark button--chromeless is-touchIconBlackPulse u-baseColor--buttonDark button--withIcon button--withSvgIcon button--dark button--chromeless" href="https://twitter.com/flutterdev" title="X profile" aria-label="X profile" target="_blank"><span class="button-defaultState"><span class="svgIcon svgIcon--twitter svgIcon--21px"><svg class="svgIcon-use" width="21" height="21" fill="none" ><path d="M11.74 9.478l4.842-5.628h-1.147l-4.204 4.887L7.873 3.85H4l5.078 7.39L4 17.142h1.147l4.44-5.16 3.546 5.16h3.873L11.74 9.478zm-1.571 1.827l-.514-.736L5.56 4.714h1.762l3.304 4.725.514.736 4.295 6.143h-1.763l-3.504-5.013z" fill="#242424"/></svg></span></span></a></div></div><div class="u-fontSize14 u-lineHeightBaseSans u-textColorDark u-paddingBottom15"><header class="heading heading--allCaps heading--light u-marginBottom10" ><div class="u-clearfix"><div class="heading-content u-floatLeft"><span class="heading-title u-marginBottom10">More, on Medium</span></div></div></header><ul class="tags tags--postTags tags--light"><li><a class="link u-baseColor--link" href="https://medium.com/tag/material-design">Material Design</a></li></ul></div></div></div><div class="col u-size8of12 u-sm-size12of12"><div class="u-marginBottom40 u-sm-marginBottom20"><div class="u-height65 u-sm-hide"></div></div><div class="js-tagStream"><div class="streamItem streamItem--postPreview js-streamItem"><div class="cardChromeless u-marginTop20 u-paddingTop10 u-paddingBottom15 u-paddingLeft20 u-paddingRight20"><div class="postArticle postArticle--short js-postArticle js-trackPostPresentation js-trackPostScrolls" data-post-id="d417a8a65564" data-source="---------0-----------------------"><div class="u-clearfix u-marginBottom15 u-paddingTop5"><div class="postMetaInline u-floatLeft u-sm-maxWidthFullWidth"><div class="u-flexCenter"><div class="postMetaInline-avatar u-flex0"><a class="link u-baseColor--link avatar" href="https://medium.com/@eilidhsouthren" data-action="show-user-card" data-action-value="152f70c4da53" data-action-type="hover" data-user-id="152f70c4da53" dir="auto"><img src="https://cdn-images-1.medium.com/fit/c/72/72/1*X-6ifCWQoKYCZ-uLGdPa4w.png" class="avatar-image u-size36x36 u-xs-size32x32" alt="Go to the profile of Eilidh Southren"></a></div><div class="postMetaInline postMetaInline-authorLockup ui-captionStrong u-flex1 u-noWrapWithEllipsis"><a class="ds-link ds-link--styleSubtle link link--darken link--accent u-accentColor--textNormal u-accentColor--textDarken" href="https://medium.com/@eilidhsouthren?source=---------0-----------------------" data-action="show-user-card" data-action-source="---------0-----------------------" data-action-value="152f70c4da53" data-action-type="hover" data-user-id="152f70c4da53" dir="auto">Eilidh Southren</a> in <a class="ds-link ds-link--styleSubtle link--darken link--accent u-accentColor--textNormal" href="https://medium.com/flutter?source=---------0-----------------------" data-action="show-collection-card" data-action-source="---------0-----------------------" data-action-value="flutter" data-action-type="hover">Flutter</a><div class="ui-caption u-fontSize12 u-baseColor--textNormal u-textColorNormal js-postMetaInlineSupplemental"><a class="link link--darken" href="https://medium.com/flutter/material-3-for-flutter-d417a8a65564?source=---------0-----------------------" data-action="open-post" data-action-value="https://medium.com/flutter/material-3-for-flutter-d417a8a65564?source=---------0-----------------------" data-action-source="preview-listing" ><time datetime="2023-01-18T08:02:28.380Z">Jan 18, 2023</time></a><span class="middotDivider u-fontSize12"></span><span class="readingTime" title="4 min read"></span></div></div></div></div></div><div><a class="" href="https://medium.com/flutter/material-3-for-flutter-d417a8a65564?source=---------0-----------------------" data-action-source="---------0-----------------------"><div class="postArticle-content js-postField"><section class="section section--body section--first section--last"><div class="section-divider"><hr class="section-divider"></div><div class="section-content"><div class="section-inner sectionLayout--insetColumn"><figure name="previewImage" id="previewImage" class="graf graf--figure graf--layoutCroppedHeightPreview graf--leading"><div class="aspectRatioPlaceholder is-locked"><div class="aspectRatioPlaceholder-fill" style="padding-bottom: 30%;"></div><img class="graf-image" data-image-id="0*RuCmIqSnK0G0kHmy.png" data-width="1024" data-height="535" data-is-featured="true" src="https://cdn-images-1.medium.com/fit/t/1600/480/0*RuCmIqSnK0G0kHmy.png"></div></figure><h3 name="3279" id="3279" class="graf graf--h3 graf-after--figure graf--title">Material 3 for Flutter</h3><h4 name="c6ce" id="c6ce" class="graf graf--h4 graf-after--h3 graf--trailing graf--subtitle">Sherlock Holmes and Dr Watson; peanut butter and jam; Flutter and Material…</h4></div></div></section></div></a></div><div class="postArticle-readMore"><a class="button button--smaller button--chromeless u-baseColor--buttonNormal" href="https://medium.com/flutter/material-3-for-flutter-d417a8a65564?source=---------0-----------------------" data-action="open-post" data-action-source="---------0-----------------------" data-action-value="https://medium.com/flutter/material-3-for-flutter-d417a8a65564?source=---------0-----------------------" data-post-id="d417a8a65564">Read more…</a></div><div class="u-clearfix u-paddingTop10"><div class="u-floatLeft"><div class="multirecommend js-actionMultirecommend u-flexCenter" data-post-id="d417a8a65564" data-is-flush-left="true" data-source="listing-----d417a8a65564---------------------clap_preview"><div class="u-relative u-foreground"><button class="button button--primary button--chromeless u-accentColor--buttonNormal button--withIcon button--withSvgIcon clapButton js-actionMultirecommendButton clapButton--darker" data-action="sign-up-prompt" data-sign-in-action="multivote" data-requires-token="true" data-redirect="https://medium.com/_/vote/p/d417a8a65564" data-action-source="listing-----d417a8a65564---------------------clap_preview" aria-label="Clap"><span class="button-defaultState"><span class="svgIcon svgIcon--clap svgIcon--25px is-flushLeft"><svg class="svgIcon-use" width="25" height="25" ><g fill-rule="evenodd"><path d="M11.739 0l.761 2.966L13.261 0z"/><path d="M14.815 3.776l1.84-2.551-1.43-.471z"/><path d="M8.378 1.224l1.84 2.551L9.81.753z"/><path d="M20.382 21.622c-1.04 1.04-2.115 1.507-3.166 1.608.168-.14.332-.29.492-.45 2.885-2.886 3.456-5.982 1.69-9.211l-1.101-1.937-.955-2.02c-.315-.676-.235-1.185.245-1.556a.836.836 0 01.66-.16c.342.056.66.28.879.605l2.856 5.023c1.179 1.962 1.379 5.119-1.6 8.098m-13.29-.528l-5.02-5.02a1 1 0 01.707-1.701c.255 0 .512.098.707.292l2.607 2.607a.442.442 0 00.624-.624L4.11 14.04l-1.75-1.75a.998.998 0 111.41-1.413l4.154 4.156a.44.44 0 00.624 0 .44.44 0 000-.624l-4.152-4.153-1.172-1.171a.998.998 0 010-1.41 1.018 1.018 0 011.41 0l1.172 1.17 4.153 4.152a.437.437 0 00.624 0 .442.442 0 000-.624L6.43 8.222a.988.988 0 01-.291-.705.99.99 0 01.29-.706 1 1 0 011.412 0l6.992 6.993a.443.443 0 00.71-.501l-1.35-2.856c-.315-.676-.235-1.185.246-1.557a.85.85 0 01.66-.16c.342.056.659.28.879.606L18.628 14c1.573 2.876 1.067 5.545-1.544 8.156-1.396 1.397-3.144 1.966-5.063 1.652-1.713-.286-3.463-1.248-4.928-2.714zM10.99 5.976l2.562 2.562c-.497.607-.563 1.414-.155 2.284l.265.562-4.257-4.257a.98.98 0 01-.117-.445c0-.267.104-.517.292-.706a1.023 1.023 0 011.41 0zm8.887 2.06c-.375-.557-.902-.916-1.486-1.011a1.738 1.738 0 00-1.342.332c-.376.29-.61.656-.712 1.065a2.1 2.1 0 00-1.095-.562 1.776 1.776 0 00-.992.128l-2.636-2.636a1.883 1.883 0 00-2.658 0 1.862 1.862 0 00-.478.847 1.886 1.886 0 00-2.671-.012 1.867 1.867 0 00-.503.909c-.754-.754-1.992-.754-2.703-.044a1.881 1.881 0 000 2.658c-.288.12-.605.288-.864.547a1.884 1.884 0 000 2.659l.624.622a1.879 1.879 0 00-.91 3.16l5.019 5.02c1.595 1.594 3.515 2.645 5.408 2.959a7.16 7.16 0 001.173.098c1.026 0 1.997-.24 2.892-.7.279.04.555.065.828.065 1.53 0 2.969-.628 4.236-1.894 3.338-3.338 3.083-6.928 1.738-9.166l-2.868-5.043z"/></g></svg></span></span><span class="button-activeState"><span class="svgIcon svgIcon--clapFilled svgIcon--25px is-flushLeft"><svg class="svgIcon-use" width="25" height="25" ><g fill-rule="evenodd"><path d="M11.738 0l.762 2.966L13.262 0z"/><path d="M16.634 1.224l-1.432-.47-.408 3.022z"/><path d="M9.79.754l-1.431.47 1.84 2.552z"/><path d="M22.472 13.307l-3.023-5.32c-.287-.426-.689-.705-1.123-.776a1.16 1.16 0 00-.911.221c-.297.231-.474.515-.535.84.017.022.036.04.053.063l2.843 5.001c1.95 3.564 1.328 6.973-1.843 10.144a8.46 8.46 0 01-.549.501c1.205-.156 2.328-.737 3.351-1.76 3.268-3.268 3.041-6.749 1.737-8.914"/><path d="M12.58 9.887c-.156-.83.096-1.569.692-2.142L10.78 5.252c-.5-.504-1.378-.504-1.879 0-.178.18-.273.4-.329.63l4.008 4.005z"/><path d="M15.812 9.04c-.218-.323-.539-.55-.88-.606a.814.814 0 00-.644.153c-.176.137-.713.553-.24 1.566l1.43 3.025a.539.539 0 11-.868.612L7.2 6.378a.986.986 0 10-1.395 1.395l4.401 4.403a.538.538 0 11-.762.762L5.046 8.54 3.802 7.295a.99.99 0 00-1.396 0 .981.981 0 000 1.394L3.647 9.93l4.402 4.403a.537.537 0 010 .761.535.535 0 01-.762 0L2.89 10.696a.992.992 0 00-1.399-.003.983.983 0 000 1.395l1.855 1.854 2.763 2.765a.538.538 0 01-.76.761l-2.765-2.764a.982.982 0 00-1.395 0 .989.989 0 000 1.395l5.32 5.32c3.371 3.372 6.64 4.977 10.49 1.126C19.74 19.8 20.271 17 18.62 13.982L15.812 9.04z"/></g></svg></span></span></button></div><span class="u-relative u-background js-actionMultirecommendCount u-marginLeft5"><button class="button button--chromeless u-baseColor--buttonNormal js-multirecommendCountButton u-disablePointerEvents" data-action="show-recommends" data-action-value="d417a8a65564">985</button></span></div></div><div class="buttonSet u-floatRight"><a class="button button--chromeless u-baseColor--buttonNormal" href="https://medium.com/flutter/material-3-for-flutter-d417a8a65564?source=---------0-----------------------#--responses" data-action-source="---------0-----------------------">7 responses</a><button class="button button--dark button--chromeless is-touchIconFadeInPulse u-baseColor--buttonDark button--withIcon button--withSvgIcon button--bookmark js-bookmarkButton" data-action="add-to-bookmarks" data-action-value="d417a8a65564"><span class="js-remove-from-bookmarks u-hide"><span class="svgIcon svgIcon--bookmarkFilled svgIcon--25px is-flushRight"><svg class="svgIcon-use" width="25" height="25" ><path d="M19 6c0-1.1-.9-2-2-2H8c-1.1 0-2 .9-2 2v14.66h.012c.01.103.045.204.12.285a.5.5 0 00.706.03L12.5 16.85l5.662 4.126c.205.183.52.17.708-.03a.5.5 0 00.118-.285H19V6z"/></svg></span></span><span class="js-add-to-bookmarks"><span class="svgIcon svgIcon--bookmarkAdd svgIcon--25px is-flushRight"><svg class="svgIcon-use" width="25" height="25" fill="none" ><path d="M18 2.5a.5.5 0 011 0V5h2.5a.5.5 0 010 1H19v2.5a.5.5 0 11-1 0V6h-2.5a.5.5 0 010-1H18V2.5z" fill="#292929"/><path d="M7 7a1 1 0 011-1h3.5a.5.5 0 000-1H8a2 2 0 00-2 2v14a.5.5 0 00.805.396L12.5 17l5.695 4.396A.5.5 0 0019 21v-8.5a.5.5 0 00-1 0v7.485l-5.195-4.012a.5.5 0 00-.61 0L7 19.985V7z" fill="#292929"/></svg></span></span></button></div></div></div></div></div><div class="streamItem streamItem--postPreview js-streamItem"><div class="cardChromeless u-marginTop20 u-paddingTop10 u-paddingBottom15 u-paddingLeft20 u-paddingRight20"><div class="postArticle postArticle--short js-postArticle js-trackPostPresentation js-trackPostScrolls" data-post-id="e3f3f622200b" data-source="---------1-----------------------"><div class="u-clearfix u-marginBottom15 u-paddingTop5"><div class="postMetaInline u-floatLeft u-sm-maxWidthFullWidth"><div class="u-flexCenter"><div class="postMetaInline-avatar u-flex0"><a class="link u-baseColor--link avatar" href="https://medium.com/@andremobilelabonte" data-action="show-user-card" data-action-value="df52ddf23910" data-action-type="hover" data-user-id="df52ddf23910" dir="auto"><img src="https://cdn-images-1.medium.com/fit/c/72/72/0*MWQEEWaslbr-PNFW" class="avatar-image u-size36x36 u-xs-size32x32" alt="Go to the profile of André Labonté"></a></div><div class="postMetaInline postMetaInline-authorLockup ui-captionStrong u-flex1 u-noWrapWithEllipsis"><a class="ds-link ds-link--styleSubtle link link--darken link--accent u-accentColor--textNormal u-accentColor--textDarken" href="https://medium.com/@andremobilelabonte?source=---------1-----------------------" data-action="show-user-card" data-action-source="---------1-----------------------" data-action-value="df52ddf23910" data-action-type="hover" data-user-id="df52ddf23910" dir="auto">André Labonté</a> in <a class="ds-link ds-link--styleSubtle link--darken link--accent u-accentColor--textNormal" href="https://medium.com/flutter?source=---------1-----------------------" data-action="show-collection-card" data-action-source="---------1-----------------------" data-action-value="flutter" data-action-type="hover">Flutter</a><div class="ui-caption u-fontSize12 u-baseColor--textNormal u-textColorNormal js-postMetaInlineSupplemental"><a class="link link--darken" href="https://medium.com/flutter/accessible-expression-with-material-icons-and-flutter-e3f3f622200b?source=---------1-----------------------" data-action="open-post" data-action-value="https://medium.com/flutter/accessible-expression-with-material-icons-and-flutter-e3f3f622200b?source=---------1-----------------------" data-action-source="preview-listing" ><time datetime="2020-11-04T16:03:18.594Z">Nov 4, 2020</time></a><span class="middotDivider u-fontSize12"></span><span class="readingTime" title="3 min read"></span></div></div></div></div></div><div><a class="" href="https://medium.com/flutter/accessible-expression-with-material-icons-and-flutter-e3f3f622200b?source=---------1-----------------------" data-action-source="---------1-----------------------"><div class="postArticle-content js-postField"><section class="section section--body section--first section--last"><div class="section-divider"><hr class="section-divider"></div><div class="section-content"><div class="section-inner sectionLayout--insetColumn"><figure name="previewImage" id="previewImage" class="graf graf--figure graf--layoutCroppedHeightPreview graf--leading"><div class="aspectRatioPlaceholder is-locked"><div class="aspectRatioPlaceholder-fill" style="padding-bottom: 30%;"></div><img class="graf-image" data-image-id="1*kcT41A5GvXp8XrjHjiuc4A.png" data-width="716" data-height="563" data-is-featured="true" alt="Sample of 4 icons: shopping_cart, chat, masks, wash shown in the 4 supported styles: filled, outlined, rounded, sharp." src="https://cdn-images-1.medium.com/fit/t/1600/480/1*kcT41A5GvXp8XrjHjiuc4A.png"></div></figure><h3 name="9944" id="9944" class="graf graf--h3 graf-after--figure graf--trailing graf--title">Accessible expression with Material Icons and Flutter</h3></div></div></section></div></a></div><div class="postArticle-readMore"><a class="button button--smaller button--chromeless u-baseColor--buttonNormal" href="https://medium.com/flutter/accessible-expression-with-material-icons-and-flutter-e3f3f622200b?source=---------1-----------------------" data-action="open-post" data-action-source="---------1-----------------------" data-action-value="https://medium.com/flutter/accessible-expression-with-material-icons-and-flutter-e3f3f622200b?source=---------1-----------------------" data-post-id="e3f3f622200b">Read more…</a></div><div class="u-clearfix u-paddingTop10"><div class="u-floatLeft"><div class="multirecommend js-actionMultirecommend u-flexCenter" data-post-id="e3f3f622200b" data-is-flush-left="true" data-source="listing-----e3f3f622200b---------------------clap_preview"><div class="u-relative u-foreground"><button class="button button--primary button--chromeless u-accentColor--buttonNormal button--withIcon button--withSvgIcon clapButton js-actionMultirecommendButton clapButton--darker" data-action="sign-up-prompt" data-sign-in-action="multivote" data-requires-token="true" data-redirect="https://medium.com/_/vote/p/e3f3f622200b" data-action-source="listing-----e3f3f622200b---------------------clap_preview" aria-label="Clap"><span class="button-defaultState"><span class="svgIcon svgIcon--clap svgIcon--25px is-flushLeft"><svg class="svgIcon-use" width="25" height="25" ><g fill-rule="evenodd"><path d="M11.739 0l.761 2.966L13.261 0z"/><path d="M14.815 3.776l1.84-2.551-1.43-.471z"/><path d="M8.378 1.224l1.84 2.551L9.81.753z"/><path d="M20.382 21.622c-1.04 1.04-2.115 1.507-3.166 1.608.168-.14.332-.29.492-.45 2.885-2.886 3.456-5.982 1.69-9.211l-1.101-1.937-.955-2.02c-.315-.676-.235-1.185.245-1.556a.836.836 0 01.66-.16c.342.056.66.28.879.605l2.856 5.023c1.179 1.962 1.379 5.119-1.6 8.098m-13.29-.528l-5.02-5.02a1 1 0 01.707-1.701c.255 0 .512.098.707.292l2.607 2.607a.442.442 0 00.624-.624L4.11 14.04l-1.75-1.75a.998.998 0 111.41-1.413l4.154 4.156a.44.44 0 00.624 0 .44.44 0 000-.624l-4.152-4.153-1.172-1.171a.998.998 0 010-1.41 1.018 1.018 0 011.41 0l1.172 1.17 4.153 4.152a.437.437 0 00.624 0 .442.442 0 000-.624L6.43 8.222a.988.988 0 01-.291-.705.99.99 0 01.29-.706 1 1 0 011.412 0l6.992 6.993a.443.443 0 00.71-.501l-1.35-2.856c-.315-.676-.235-1.185.246-1.557a.85.85 0 01.66-.16c.342.056.659.28.879.606L18.628 14c1.573 2.876 1.067 5.545-1.544 8.156-1.396 1.397-3.144 1.966-5.063 1.652-1.713-.286-3.463-1.248-4.928-2.714zM10.99 5.976l2.562 2.562c-.497.607-.563 1.414-.155 2.284l.265.562-4.257-4.257a.98.98 0 01-.117-.445c0-.267.104-.517.292-.706a1.023 1.023 0 011.41 0zm8.887 2.06c-.375-.557-.902-.916-1.486-1.011a1.738 1.738 0 00-1.342.332c-.376.29-.61.656-.712 1.065a2.1 2.1 0 00-1.095-.562 1.776 1.776 0 00-.992.128l-2.636-2.636a1.883 1.883 0 00-2.658 0 1.862 1.862 0 00-.478.847 1.886 1.886 0 00-2.671-.012 1.867 1.867 0 00-.503.909c-.754-.754-1.992-.754-2.703-.044a1.881 1.881 0 000 2.658c-.288.12-.605.288-.864.547a1.884 1.884 0 000 2.659l.624.622a1.879 1.879 0 00-.91 3.16l5.019 5.02c1.595 1.594 3.515 2.645 5.408 2.959a7.16 7.16 0 001.173.098c1.026 0 1.997-.24 2.892-.7.279.04.555.065.828.065 1.53 0 2.969-.628 4.236-1.894 3.338-3.338 3.083-6.928 1.738-9.166l-2.868-5.043z"/></g></svg></span></span><span class="button-activeState"><span class="svgIcon svgIcon--clapFilled svgIcon--25px is-flushLeft"><svg class="svgIcon-use" width="25" height="25" ><g fill-rule="evenodd"><path d="M11.738 0l.762 2.966L13.262 0z"/><path d="M16.634 1.224l-1.432-.47-.408 3.022z"/><path d="M9.79.754l-1.431.47 1.84 2.552z"/><path d="M22.472 13.307l-3.023-5.32c-.287-.426-.689-.705-1.123-.776a1.16 1.16 0 00-.911.221c-.297.231-.474.515-.535.84.017.022.036.04.053.063l2.843 5.001c1.95 3.564 1.328 6.973-1.843 10.144a8.46 8.46 0 01-.549.501c1.205-.156 2.328-.737 3.351-1.76 3.268-3.268 3.041-6.749 1.737-8.914"/><path d="M12.58 9.887c-.156-.83.096-1.569.692-2.142L10.78 5.252c-.5-.504-1.378-.504-1.879 0-.178.18-.273.4-.329.63l4.008 4.005z"/><path d="M15.812 9.04c-.218-.323-.539-.55-.88-.606a.814.814 0 00-.644.153c-.176.137-.713.553-.24 1.566l1.43 3.025a.539.539 0 11-.868.612L7.2 6.378a.986.986 0 10-1.395 1.395l4.401 4.403a.538.538 0 11-.762.762L5.046 8.54 3.802 7.295a.99.99 0 00-1.396 0 .981.981 0 000 1.394L3.647 9.93l4.402 4.403a.537.537 0 010 .761.535.535 0 01-.762 0L2.89 10.696a.992.992 0 00-1.399-.003.983.983 0 000 1.395l1.855 1.854 2.763 2.765a.538.538 0 01-.76.761l-2.765-2.764a.982.982 0 00-1.395 0 .989.989 0 000 1.395l5.32 5.32c3.371 3.372 6.64 4.977 10.49 1.126C19.74 19.8 20.271 17 18.62 13.982L15.812 9.04z"/></g></svg></span></span></button></div><span class="u-relative u-background js-actionMultirecommendCount u-marginLeft5"><button class="button button--chromeless u-baseColor--buttonNormal js-multirecommendCountButton u-disablePointerEvents" data-action="show-recommends" data-action-value="e3f3f622200b">585</button></span></div></div><div class="buttonSet u-floatRight"><a class="button button--chromeless u-baseColor--buttonNormal" href="https://medium.com/flutter/accessible-expression-with-material-icons-and-flutter-e3f3f622200b?source=---------1-----------------------#--responses" data-action-source="---------1-----------------------">2 responses</a><button class="button button--dark button--chromeless is-touchIconFadeInPulse u-baseColor--buttonDark button--withIcon button--withSvgIcon button--bookmark js-bookmarkButton" data-action="add-to-bookmarks" data-action-value="e3f3f622200b"><span class="js-remove-from-bookmarks u-hide"><span class="svgIcon svgIcon--bookmarkFilled svgIcon--25px is-flushRight"><svg class="svgIcon-use" width="25" height="25" ><path d="M19 6c0-1.1-.9-2-2-2H8c-1.1 0-2 .9-2 2v14.66h.012c.01.103.045.204.12.285a.5.5 0 00.706.03L12.5 16.85l5.662 4.126c.205.183.52.17.708-.03a.5.5 0 00.118-.285H19V6z"/></svg></span></span><span class="js-add-to-bookmarks"><span class="svgIcon svgIcon--bookmarkAdd svgIcon--25px is-flushRight"><svg class="svgIcon-use" width="25" height="25" fill="none" ><path d="M18 2.5a.5.5 0 011 0V5h2.5a.5.5 0 010 1H19v2.5a.5.5 0 11-1 0V6h-2.5a.5.5 0 010-1H18V2.5z" fill="#292929"/><path d="M7 7a1 1 0 011-1h3.5a.5.5 0 000-1H8a2 2 0 00-2 2v14a.5.5 0 00.805.396L12.5 17l5.695 4.396A.5.5 0 0019 21v-8.5a.5.5 0 00-1 0v7.485l-5.195-4.012a.5.5 0 00-.61 0L7 19.985V7z" fill="#292929"/></svg></span></span></button></div></div></div></div></div><div class="streamItem streamItem--postPreview js-streamItem"><div class="cardChromeless u-marginTop20 u-paddingTop10 u-paddingBottom15 u-paddingLeft20 u-paddingRight20"><div class="postArticle postArticle--short js-postArticle js-trackPostPresentation js-trackPostScrolls" data-post-id="ce48a22611a3" data-source="---------2-----------------------"><div class="u-clearfix u-marginBottom15 u-paddingTop5"><div class="postMetaInline u-floatLeft u-sm-maxWidthFullWidth"><div class="u-flexCenter"><div class="postMetaInline-avatar u-flex0"><a class="link u-baseColor--link avatar" href="https://medium.com/@josealba199675" data-action="show-user-card" data-action-value="a8e501ba3326" data-action-type="hover" data-user-id="a8e501ba3326" dir="auto"><img src="https://cdn-images-1.medium.com/fit/c/72/72/0*hPHb0U1EVsdSI-ZK" class="avatar-image u-size36x36 u-xs-size32x32" alt="Go to the profile of Jose Alba"></a></div><div class="postMetaInline postMetaInline-authorLockup ui-captionStrong u-flex1 u-noWrapWithEllipsis"><a class="ds-link ds-link--styleSubtle link link--darken link--accent u-accentColor--textNormal u-accentColor--textDarken" href="https://medium.com/@josealba199675?source=---------2-----------------------" data-action="show-user-card" data-action-source="---------2-----------------------" data-action-value="a8e501ba3326" data-action-type="hover" data-user-id="a8e501ba3326" dir="auto">Jose Alba</a> in <a class="ds-link ds-link--styleSubtle link--darken link--accent u-accentColor--textNormal" href="https://medium.com/flutter?source=---------2-----------------------" data-action="show-collection-card" data-action-source="---------2-----------------------" data-action-value="flutter" data-action-type="hover">Flutter</a><div class="ui-caption u-fontSize12 u-baseColor--textNormal u-textColorNormal js-postMetaInlineSupplemental"><a class="link link--darken" href="https://medium.com/flutter/whats-new-with-the-slider-widget-ce48a22611a3?source=---------2-----------------------" data-action="open-post" data-action-value="https://medium.com/flutter/whats-new-with-the-slider-widget-ce48a22611a3?source=---------2-----------------------" data-action-source="preview-listing" ><time datetime="2020-06-18T20:32:15.085Z">Jun 18, 2020</time></a><span class="middotDivider u-fontSize12"></span><span class="readingTime" title="6 min read"></span></div></div></div></div></div><div><a class="" href="https://medium.com/flutter/whats-new-with-the-slider-widget-ce48a22611a3?source=---------2-----------------------" data-action-source="---------2-----------------------"><div class="postArticle-content js-postField"><section class="section section--body section--first section--last"><div class="section-divider"><hr class="section-divider"></div><div class="section-content"><div class="section-inner sectionLayout--insetColumn"><figure name="previewImage" id="previewImage" class="graf graf--figure graf--layoutCroppedHeightPreview graf--leading"><div class="aspectRatioPlaceholder is-locked"><div class="aspectRatioPlaceholder-fill" style="padding-bottom: 30%;"></div><img class="graf-image" data-image-id="1*0vbyZT-NITTvqljO8HtU4w.png" data-width="3042" data-height="1740" data-is-featured="true" src="https://cdn-images-1.medium.com/fit/t/1600/480/1*0vbyZT-NITTvqljO8HtU4w.png"></div></figure><h3 name="15f7" id="15f7" class="graf graf--h3 graf-after--figure graf--title">What’s new with the Slider widget?</h3><p name="f65e" id="f65e" class="graf graf--p graf-after--h3 graf--trailing">Flutter lets you create beautiful, natively compiled applications. The reason Flutter can do this…</p></div></div></section></div></a></div><div class="postArticle-readMore"><a class="button button--smaller button--chromeless u-baseColor--buttonNormal" href="https://medium.com/flutter/whats-new-with-the-slider-widget-ce48a22611a3?source=---------2-----------------------" data-action="open-post" data-action-source="---------2-----------------------" data-action-value="https://medium.com/flutter/whats-new-with-the-slider-widget-ce48a22611a3?source=---------2-----------------------" data-post-id="ce48a22611a3">Read more…</a></div><div class="u-clearfix u-paddingTop10"><div class="u-floatLeft"><div class="multirecommend js-actionMultirecommend u-flexCenter" data-post-id="ce48a22611a3" data-is-flush-left="true" data-source="listing-----ce48a22611a3---------------------clap_preview"><div class="u-relative u-foreground"><button class="button button--primary button--chromeless u-accentColor--buttonNormal button--withIcon button--withSvgIcon clapButton js-actionMultirecommendButton clapButton--darker" data-action="sign-up-prompt" data-sign-in-action="multivote" data-requires-token="true" data-redirect="https://medium.com/_/vote/p/ce48a22611a3" data-action-source="listing-----ce48a22611a3---------------------clap_preview" aria-label="Clap"><span class="button-defaultState"><span class="svgIcon svgIcon--clap svgIcon--25px is-flushLeft"><svg class="svgIcon-use" width="25" height="25" ><g fill-rule="evenodd"><path d="M11.739 0l.761 2.966L13.261 0z"/><path d="M14.815 3.776l1.84-2.551-1.43-.471z"/><path d="M8.378 1.224l1.84 2.551L9.81.753z"/><path d="M20.382 21.622c-1.04 1.04-2.115 1.507-3.166 1.608.168-.14.332-.29.492-.45 2.885-2.886 3.456-5.982 1.69-9.211l-1.101-1.937-.955-2.02c-.315-.676-.235-1.185.245-1.556a.836.836 0 01.66-.16c.342.056.66.28.879.605l2.856 5.023c1.179 1.962 1.379 5.119-1.6 8.098m-13.29-.528l-5.02-5.02a1 1 0 01.707-1.701c.255 0 .512.098.707.292l2.607 2.607a.442.442 0 00.624-.624L4.11 14.04l-1.75-1.75a.998.998 0 111.41-1.413l4.154 4.156a.44.44 0 00.624 0 .44.44 0 000-.624l-4.152-4.153-1.172-1.171a.998.998 0 010-1.41 1.018 1.018 0 011.41 0l1.172 1.17 4.153 4.152a.437.437 0 00.624 0 .442.442 0 000-.624L6.43 8.222a.988.988 0 01-.291-.705.99.99 0 01.29-.706 1 1 0 011.412 0l6.992 6.993a.443.443 0 00.71-.501l-1.35-2.856c-.315-.676-.235-1.185.246-1.557a.85.85 0 01.66-.16c.342.056.659.28.879.606L18.628 14c1.573 2.876 1.067 5.545-1.544 8.156-1.396 1.397-3.144 1.966-5.063 1.652-1.713-.286-3.463-1.248-4.928-2.714zM10.99 5.976l2.562 2.562c-.497.607-.563 1.414-.155 2.284l.265.562-4.257-4.257a.98.98 0 01-.117-.445c0-.267.104-.517.292-.706a1.023 1.023 0 011.41 0zm8.887 2.06c-.375-.557-.902-.916-1.486-1.011a1.738 1.738 0 00-1.342.332c-.376.29-.61.656-.712 1.065a2.1 2.1 0 00-1.095-.562 1.776 1.776 0 00-.992.128l-2.636-2.636a1.883 1.883 0 00-2.658 0 1.862 1.862 0 00-.478.847 1.886 1.886 0 00-2.671-.012 1.867 1.867 0 00-.503.909c-.754-.754-1.992-.754-2.703-.044a1.881 1.881 0 000 2.658c-.288.12-.605.288-.864.547a1.884 1.884 0 000 2.659l.624.622a1.879 1.879 0 00-.91 3.16l5.019 5.02c1.595 1.594 3.515 2.645 5.408 2.959a7.16 7.16 0 001.173.098c1.026 0 1.997-.24 2.892-.7.279.04.555.065.828.065 1.53 0 2.969-.628 4.236-1.894 3.338-3.338 3.083-6.928 1.738-9.166l-2.868-5.043z"/></g></svg></span></span><span class="button-activeState"><span class="svgIcon svgIcon--clapFilled svgIcon--25px is-flushLeft"><svg class="svgIcon-use" width="25" height="25" ><g fill-rule="evenodd"><path d="M11.738 0l.762 2.966L13.262 0z"/><path d="M16.634 1.224l-1.432-.47-.408 3.022z"/><path d="M9.79.754l-1.431.47 1.84 2.552z"/><path d="M22.472 13.307l-3.023-5.32c-.287-.426-.689-.705-1.123-.776a1.16 1.16 0 00-.911.221c-.297.231-.474.515-.535.84.017.022.036.04.053.063l2.843 5.001c1.95 3.564 1.328 6.973-1.843 10.144a8.46 8.46 0 01-.549.501c1.205-.156 2.328-.737 3.351-1.76 3.268-3.268 3.041-6.749 1.737-8.914"/><path d="M12.58 9.887c-.156-.83.096-1.569.692-2.142L10.78 5.252c-.5-.504-1.378-.504-1.879 0-.178.18-.273.4-.329.63l4.008 4.005z"/><path d="M15.812 9.04c-.218-.323-.539-.55-.88-.606a.814.814 0 00-.644.153c-.176.137-.713.553-.24 1.566l1.43 3.025a.539.539 0 11-.868.612L7.2 6.378a.986.986 0 10-1.395 1.395l4.401 4.403a.538.538 0 11-.762.762L5.046 8.54 3.802 7.295a.99.99 0 00-1.396 0 .981.981 0 000 1.394L3.647 9.93l4.402 4.403a.537.537 0 010 .761.535.535 0 01-.762 0L2.89 10.696a.992.992 0 00-1.399-.003.983.983 0 000 1.395l1.855 1.854 2.763 2.765a.538.538 0 01-.76.761l-2.765-2.764a.982.982 0 00-1.395 0 .989.989 0 000 1.395l5.32 5.32c3.371 3.372 6.64 4.977 10.49 1.126C19.74 19.8 20.271 17 18.62 13.982L15.812 9.04z"/></g></svg></span></span></button></div><span class="u-relative u-background js-actionMultirecommendCount u-marginLeft5"><button class="button button--chromeless u-baseColor--buttonNormal js-multirecommendCountButton u-disablePointerEvents" data-action="show-recommends" data-action-value="ce48a22611a3">835</button></span></div></div><div class="buttonSet u-floatRight"><a class="button button--chromeless u-baseColor--buttonNormal" href="https://medium.com/flutter/whats-new-with-the-slider-widget-ce48a22611a3?source=---------2-----------------------#--responses" data-action-source="---------2-----------------------">1 response</a><button class="button button--dark button--chromeless is-touchIconFadeInPulse u-baseColor--buttonDark button--withIcon button--withSvgIcon button--bookmark js-bookmarkButton" data-action="add-to-bookmarks" data-action-value="ce48a22611a3"><span class="js-remove-from-bookmarks u-hide"><span class="svgIcon svgIcon--bookmarkFilled svgIcon--25px is-flushRight"><svg class="svgIcon-use" width="25" height="25" ><path d="M19 6c0-1.1-.9-2-2-2H8c-1.1 0-2 .9-2 2v14.66h.012c.01.103.045.204.12.285a.5.5 0 00.706.03L12.5 16.85l5.662 4.126c.205.183.52.17.708-.03a.5.5 0 00.118-.285H19V6z"/></svg></span></span><span class="js-add-to-bookmarks"><span class="svgIcon svgIcon--bookmarkAdd svgIcon--25px is-flushRight"><svg class="svgIcon-use" width="25" height="25" fill="none" ><path d="M18 2.5a.5.5 0 011 0V5h2.5a.5.5 0 010 1H19v2.5a.5.5 0 11-1 0V6h-2.5a.5.5 0 010-1H18V2.5z" fill="#292929"/><path d="M7 7a1 1 0 011-1h3.5a.5.5 0 000-1H8a2 2 0 00-2 2v14a.5.5 0 00.805.396L12.5 17l5.695 4.396A.5.5 0 0019 21v-8.5a.5.5 0 00-1 0v7.485l-5.195-4.012a.5.5 0 00-.61 0L7 19.985V7z" fill="#292929"/></svg></span></span></button></div></div></div></div></div><div class="streamItem streamItem--postPreview js-streamItem"><div class="cardChromeless u-marginTop20 u-paddingTop10 u-paddingBottom15 u-paddingLeft20 u-paddingRight20"><div class="postArticle postArticle--short js-postArticle js-trackPostPresentation js-trackPostScrolls" data-post-id="535fbe3cd674" data-source="---------3-----------------------"><div class="u-clearfix u-marginBottom15 u-paddingTop5"><div class="postMetaInline u-floatLeft u-sm-maxWidthFullWidth"><div class="u-flexCenter"><div class="postMetaInline-avatar u-flex0"><a class="link u-baseColor--link avatar" href="https://medium.com/@perclasson" data-action="show-user-card" data-action-value="4cad326de3d7" data-action-type="hover" data-user-id="4cad326de3d7" dir="auto"><img src="https://cdn-images-1.medium.com/fit/c/72/72/2*d-UpSVU0saEV2On5JBvYaQ.jpeg" class="avatar-image u-size36x36 u-xs-size32x32" alt="Go to the profile of Per Classon"></a></div><div class="postMetaInline postMetaInline-authorLockup ui-captionStrong u-flex1 u-noWrapWithEllipsis"><a class="ds-link ds-link--styleSubtle link link--darken link--accent u-accentColor--textNormal u-accentColor--textDarken" href="https://medium.com/@perclasson?source=---------3-----------------------" data-action="show-user-card" data-action-source="---------3-----------------------" data-action-value="4cad326de3d7" data-action-type="hover" data-user-id="4cad326de3d7" dir="auto">Per Classon</a> in <a class="ds-link ds-link--styleSubtle link--darken link--accent u-accentColor--textNormal" href="https://medium.com/flutter?source=---------3-----------------------" data-action="show-collection-card" data-action-source="---------3-----------------------" data-action-value="flutter" data-action-type="hover">Flutter</a><div class="ui-caption u-fontSize12 u-baseColor--textNormal u-textColorNormal js-postMetaInlineSupplemental"><a class="link link--darken" href="https://medium.com/flutter/optimizing-performance-in-flutter-web-apps-with-tree-shaking-and-deferred-loading-535fbe3cd674?source=---------3-----------------------" data-action="open-post" data-action-value="https://medium.com/flutter/optimizing-performance-in-flutter-web-apps-with-tree-shaking-and-deferred-loading-535fbe3cd674?source=---------3-----------------------" data-action-source="preview-listing" ><time datetime="2020-05-19T13:57:49.784Z">May 19, 2020</time></a><span class="middotDivider u-fontSize12"></span><span class="readingTime" title="4 min read"></span></div></div></div></div></div><div><a class="" href="https://medium.com/flutter/optimizing-performance-in-flutter-web-apps-with-tree-shaking-and-deferred-loading-535fbe3cd674?source=---------3-----------------------" data-action-source="---------3-----------------------"><div class="postArticle-content js-postField"><section class="section section--body section--first section--last"><div class="section-divider"><hr class="section-divider"></div><div class="section-content"><div class="section-inner sectionLayout--insetColumn"><figure name="previewImage" id="previewImage" class="graf graf--figure graf--layoutCroppedHeightPreview graf--leading"><div class="aspectRatioPlaceholder is-locked"><div class="aspectRatioPlaceholder-fill" style="padding-bottom: 30%;"></div><img class="graf-image" data-image-id="0*Z8CmvWbWVXUb9Wy4" data-width="1374" data-height="532" data-is-featured="true" src="https://cdn-images-1.medium.com/fit/t/1600/480/0*Z8CmvWbWVXUb9Wy4"></div></figure><h3 name="a3e7" id="a3e7" class="graf graf--h3 graf-after--figure graf--trailing graf--title">Optimizing performance in Flutter web apps with tree shaking and deferred loading</h3></div></div></section></div></a></div><div class="postArticle-readMore"><a class="button button--smaller button--chromeless u-baseColor--buttonNormal" href="https://medium.com/flutter/optimizing-performance-in-flutter-web-apps-with-tree-shaking-and-deferred-loading-535fbe3cd674?source=---------3-----------------------" data-action="open-post" data-action-source="---------3-----------------------" data-action-value="https://medium.com/flutter/optimizing-performance-in-flutter-web-apps-with-tree-shaking-and-deferred-loading-535fbe3cd674?source=---------3-----------------------" data-post-id="535fbe3cd674">Read more…</a></div><div class="u-clearfix u-paddingTop10"><div class="u-floatLeft"><div class="multirecommend js-actionMultirecommend u-flexCenter" data-post-id="535fbe3cd674" data-is-flush-left="true" data-source="listing-----535fbe3cd674---------------------clap_preview"><div class="u-relative u-foreground"><button class="button button--primary button--chromeless u-accentColor--buttonNormal button--withIcon button--withSvgIcon clapButton js-actionMultirecommendButton clapButton--darker" data-action="sign-up-prompt" data-sign-in-action="multivote" data-requires-token="true" data-redirect="https://medium.com/_/vote/p/535fbe3cd674" data-action-source="listing-----535fbe3cd674---------------------clap_preview" aria-label="Clap"><span class="button-defaultState"><span class="svgIcon svgIcon--clap svgIcon--25px is-flushLeft"><svg class="svgIcon-use" width="25" height="25" ><g fill-rule="evenodd"><path d="M11.739 0l.761 2.966L13.261 0z"/><path d="M14.815 3.776l1.84-2.551-1.43-.471z"/><path d="M8.378 1.224l1.84 2.551L9.81.753z"/><path d="M20.382 21.622c-1.04 1.04-2.115 1.507-3.166 1.608.168-.14.332-.29.492-.45 2.885-2.886 3.456-5.982 1.69-9.211l-1.101-1.937-.955-2.02c-.315-.676-.235-1.185.245-1.556a.836.836 0 01.66-.16c.342.056.66.28.879.605l2.856 5.023c1.179 1.962 1.379 5.119-1.6 8.098m-13.29-.528l-5.02-5.02a1 1 0 01.707-1.701c.255 0 .512.098.707.292l2.607 2.607a.442.442 0 00.624-.624L4.11 14.04l-1.75-1.75a.998.998 0 111.41-1.413l4.154 4.156a.44.44 0 00.624 0 .44.44 0 000-.624l-4.152-4.153-1.172-1.171a.998.998 0 010-1.41 1.018 1.018 0 011.41 0l1.172 1.17 4.153 4.152a.437.437 0 00.624 0 .442.442 0 000-.624L6.43 8.222a.988.988 0 01-.291-.705.99.99 0 01.29-.706 1 1 0 011.412 0l6.992 6.993a.443.443 0 00.71-.501l-1.35-2.856c-.315-.676-.235-1.185.246-1.557a.85.85 0 01.66-.16c.342.056.659.28.879.606L18.628 14c1.573 2.876 1.067 5.545-1.544 8.156-1.396 1.397-3.144 1.966-5.063 1.652-1.713-.286-3.463-1.248-4.928-2.714zM10.99 5.976l2.562 2.562c-.497.607-.563 1.414-.155 2.284l.265.562-4.257-4.257a.98.98 0 01-.117-.445c0-.267.104-.517.292-.706a1.023 1.023 0 011.41 0zm8.887 2.06c-.375-.557-.902-.916-1.486-1.011a1.738 1.738 0 00-1.342.332c-.376.29-.61.656-.712 1.065a2.1 2.1 0 00-1.095-.562 1.776 1.776 0 00-.992.128l-2.636-2.636a1.883 1.883 0 00-2.658 0 1.862 1.862 0 00-.478.847 1.886 1.886 0 00-2.671-.012 1.867 1.867 0 00-.503.909c-.754-.754-1.992-.754-2.703-.044a1.881 1.881 0 000 2.658c-.288.12-.605.288-.864.547a1.884 1.884 0 000 2.659l.624.622a1.879 1.879 0 00-.91 3.16l5.019 5.02c1.595 1.594 3.515 2.645 5.408 2.959a7.16 7.16 0 001.173.098c1.026 0 1.997-.24 2.892-.7.279.04.555.065.828.065 1.53 0 2.969-.628 4.236-1.894 3.338-3.338 3.083-6.928 1.738-9.166l-2.868-5.043z"/></g></svg></span></span><span class="button-activeState"><span class="svgIcon svgIcon--clapFilled svgIcon--25px is-flushLeft"><svg class="svgIcon-use" width="25" height="25" ><g fill-rule="evenodd"><path d="M11.738 0l.762 2.966L13.262 0z"/><path d="M16.634 1.224l-1.432-.47-.408 3.022z"/><path d="M9.79.754l-1.431.47 1.84 2.552z"/><path d="M22.472 13.307l-3.023-5.32c-.287-.426-.689-.705-1.123-.776a1.16 1.16 0 00-.911.221c-.297.231-.474.515-.535.84.017.022.036.04.053.063l2.843 5.001c1.95 3.564 1.328 6.973-1.843 10.144a8.46 8.46 0 01-.549.501c1.205-.156 2.328-.737 3.351-1.76 3.268-3.268 3.041-6.749 1.737-8.914"/><path d="M12.58 9.887c-.156-.83.096-1.569.692-2.142L10.78 5.252c-.5-.504-1.378-.504-1.879 0-.178.18-.273.4-.329.63l4.008 4.005z"/><path d="M15.812 9.04c-.218-.323-.539-.55-.88-.606a.814.814 0 00-.644.153c-.176.137-.713.553-.24 1.566l1.43 3.025a.539.539 0 11-.868.612L7.2 6.378a.986.986 0 10-1.395 1.395l4.401 4.403a.538.538 0 11-.762.762L5.046 8.54 3.802 7.295a.99.99 0 00-1.396 0 .981.981 0 000 1.394L3.647 9.93l4.402 4.403a.537.537 0 010 .761.535.535 0 01-.762 0L2.89 10.696a.992.992 0 00-1.399-.003.983.983 0 000 1.395l1.855 1.854 2.763 2.765a.538.538 0 01-.76.761l-2.765-2.764a.982.982 0 00-1.395 0 .989.989 0 000 1.395l5.32 5.32c3.371 3.372 6.64 4.977 10.49 1.126C19.74 19.8 20.271 17 18.62 13.982L15.812 9.04z"/></g></svg></span></span></button></div><span class="u-relative u-background js-actionMultirecommendCount u-marginLeft5"><button class="button button--chromeless u-baseColor--buttonNormal js-multirecommendCountButton u-disablePointerEvents" data-action="show-recommends" data-action-value="535fbe3cd674">1.5K</button></span></div></div><div class="buttonSet u-floatRight"><a class="button button--chromeless u-baseColor--buttonNormal" href="https://medium.com/flutter/optimizing-performance-in-flutter-web-apps-with-tree-shaking-and-deferred-loading-535fbe3cd674?source=---------3-----------------------#--responses" data-action-source="---------3-----------------------">8 responses</a><button class="button button--dark button--chromeless is-touchIconFadeInPulse u-baseColor--buttonDark button--withIcon button--withSvgIcon button--bookmark js-bookmarkButton" data-action="add-to-bookmarks" data-action-value="535fbe3cd674"><span class="js-remove-from-bookmarks u-hide"><span class="svgIcon svgIcon--bookmarkFilled svgIcon--25px is-flushRight"><svg class="svgIcon-use" width="25" height="25" ><path d="M19 6c0-1.1-.9-2-2-2H8c-1.1 0-2 .9-2 2v14.66h.012c.01.103.045.204.12.285a.5.5 0 00.706.03L12.5 16.85l5.662 4.126c.205.183.52.17.708-.03a.5.5 0 00.118-.285H19V6z"/></svg></span></span><span class="js-add-to-bookmarks"><span class="svgIcon svgIcon--bookmarkAdd svgIcon--25px is-flushRight"><svg class="svgIcon-use" width="25" height="25" fill="none" ><path d="M18 2.5a.5.5 0 011 0V5h2.5a.5.5 0 010 1H19v2.5a.5.5 0 11-1 0V6h-2.5a.5.5 0 010-1H18V2.5z" fill="#292929"/><path d="M7 7a1 1 0 011-1h3.5a.5.5 0 000-1H8a2 2 0 00-2 2v14a.5.5 0 00.805.396L12.5 17l5.695 4.396A.5.5 0 0019 21v-8.5a.5.5 0 00-1 0v7.485l-5.195-4.012a.5.5 0 00-.61 0L7 19.985V7z" fill="#292929"/></svg></span></span></button></div></div></div></div></div><div class="streamItem streamItem--postPreview js-streamItem"><div class="cardChromeless u-marginTop20 u-paddingTop10 u-paddingBottom15 u-paddingLeft20 u-paddingRight20"><div class="postArticle postArticle--short js-postArticle js-trackPostPresentation js-trackPostScrolls" data-post-id="c0e993617118" data-source="---------4-----------------------"><div class="u-clearfix u-marginBottom15 u-paddingTop5"><div class="postMetaInline u-floatLeft u-sm-maxWidthFullWidth"><div class="u-flexCenter"><div class="postMetaInline-avatar u-flex0"><a class="link u-baseColor--link avatar" href="https://medium.com/@clocksmith" data-action="show-user-card" data-action-value="40a15fe2c58f" data-action-type="hover" data-user-id="40a15fe2c58f" dir="auto"><img src="https://cdn-images-1.medium.com/fit/c/72/72/1*fcJn7cFYnwInCzoug_PoDA.jpeg" class="avatar-image u-size36x36 u-xs-size32x32" alt="Go to the profile of Anthony Robledo"></a></div><div class="postMetaInline postMetaInline-authorLockup ui-captionStrong u-flex1 u-noWrapWithEllipsis"><a class="ds-link ds-link--styleSubtle link link--darken link--accent u-accentColor--textNormal u-accentColor--textDarken" href="https://medium.com/@clocksmith?source=---------4-----------------------" data-action="show-user-card" data-action-source="---------4-----------------------" data-action-value="40a15fe2c58f" data-action-type="hover" data-user-id="40a15fe2c58f" dir="auto">Anthony Robledo</a> in <a class="ds-link ds-link--styleSubtle link--darken link--accent u-accentColor--textNormal" href="https://medium.com/flutter?source=---------4-----------------------" data-action="show-collection-card" data-action-source="---------4-----------------------" data-action-value="flutter" data-action-type="hover">Flutter</a><div class="ui-caption u-fontSize12 u-baseColor--textNormal u-textColorNormal js-postMetaInlineSupplemental"><a class="link link--darken" href="https://medium.com/flutter/introducing-google-fonts-for-flutter-v-1-0-0-c0e993617118?source=---------4-----------------------" data-action="open-post" data-action-value="https://medium.com/flutter/introducing-google-fonts-for-flutter-v-1-0-0-c0e993617118?source=---------4-----------------------" data-action-source="preview-listing" ><time datetime="2020-04-23T14:01:01.302Z">Apr 23, 2020</time></a><span class="middotDivider u-fontSize12"></span><span class="readingTime" title="2 min read"></span></div></div></div></div></div><div><a class="" href="https://medium.com/flutter/introducing-google-fonts-for-flutter-v-1-0-0-c0e993617118?source=---------4-----------------------" data-action-source="---------4-----------------------"><div class="postArticle-content js-postField"><section class="section section--body section--first section--last"><div class="section-divider"><hr class="section-divider"></div><div class="section-content"><div class="section-inner sectionLayout--insetColumn"><h3 name="7e04" id="7e04" class="graf graf--h3 graf--leading graf--title">Introducing Google Fonts for Flutter v 1.0.0!</h3><p name="773a" id="773a" class="graf graf--p graf-after--h3">By <span class="markup--user markup--p-user" data-action="show-user-card" data-action-type="hover" data-user-id="40a15fe2c58f" data-action-value="40a15fe2c58f">Anthony Robledo</a> and <span class="markup--user markup--p-user" data-action="show-user-card" data-action-type="hover" data-user-id="4152a8734e54" data-action-value="4152a8734e54">MH Johnson</a></p><figure name="9b99" id="9b99" class="graf graf--figure graf--layoutConstrainedHeightPreview graf-after--p graf--trailing"><div class="aspectRatioPlaceholder is-locked" style="max-width: 720px; max-height: 240px;"><div class="aspectRatioPlaceholder-fill" style="padding-bottom: 33.300000000000004%;"></div><img class="graf-image" data-image-id="1*ndZ8HED7jp2f0X4IFSwtdA.png" data-width="1200" data-height="400" src="https://cdn-images-1.medium.com/max/1200/1*ndZ8HED7jp2f0X4IFSwtdA.png"></div></figure></div></div></section></div></a></div><div class="postArticle-readMore"><a class="button button--smaller button--chromeless u-baseColor--buttonNormal" href="https://medium.com/flutter/introducing-google-fonts-for-flutter-v-1-0-0-c0e993617118?source=---------4-----------------------" data-action="open-post" data-action-source="---------4-----------------------" data-action-value="https://medium.com/flutter/introducing-google-fonts-for-flutter-v-1-0-0-c0e993617118?source=---------4-----------------------" data-post-id="c0e993617118">Read more…</a></div><div class="u-clearfix u-paddingTop10"><div class="u-floatLeft"><div class="multirecommend js-actionMultirecommend u-flexCenter" data-post-id="c0e993617118" data-is-flush-left="true" data-source="listing-----c0e993617118---------------------clap_preview"><div class="u-relative u-foreground"><button class="button button--primary button--chromeless u-accentColor--buttonNormal button--withIcon button--withSvgIcon clapButton js-actionMultirecommendButton clapButton--darker" data-action="sign-up-prompt" data-sign-in-action="multivote" data-requires-token="true" data-redirect="https://medium.com/_/vote/p/c0e993617118" data-action-source="listing-----c0e993617118---------------------clap_preview" aria-label="Clap"><span class="button-defaultState"><span class="svgIcon svgIcon--clap svgIcon--25px is-flushLeft"><svg class="svgIcon-use" width="25" height="25" ><g fill-rule="evenodd"><path d="M11.739 0l.761 2.966L13.261 0z"/><path d="M14.815 3.776l1.84-2.551-1.43-.471z"/><path d="M8.378 1.224l1.84 2.551L9.81.753z"/><path d="M20.382 21.622c-1.04 1.04-2.115 1.507-3.166 1.608.168-.14.332-.29.492-.45 2.885-2.886 3.456-5.982 1.69-9.211l-1.101-1.937-.955-2.02c-.315-.676-.235-1.185.245-1.556a.836.836 0 01.66-.16c.342.056.66.28.879.605l2.856 5.023c1.179 1.962 1.379 5.119-1.6 8.098m-13.29-.528l-5.02-5.02a1 1 0 01.707-1.701c.255 0 .512.098.707.292l2.607 2.607a.442.442 0 00.624-.624L4.11 14.04l-1.75-1.75a.998.998 0 111.41-1.413l4.154 4.156a.44.44 0 00.624 0 .44.44 0 000-.624l-4.152-4.153-1.172-1.171a.998.998 0 010-1.41 1.018 1.018 0 011.41 0l1.172 1.17 4.153 4.152a.437.437 0 00.624 0 .442.442 0 000-.624L6.43 8.222a.988.988 0 01-.291-.705.99.99 0 01.29-.706 1 1 0 011.412 0l6.992 6.993a.443.443 0 00.71-.501l-1.35-2.856c-.315-.676-.235-1.185.246-1.557a.85.85 0 01.66-.16c.342.056.659.28.879.606L18.628 14c1.573 2.876 1.067 5.545-1.544 8.156-1.396 1.397-3.144 1.966-5.063 1.652-1.713-.286-3.463-1.248-4.928-2.714zM10.99 5.976l2.562 2.562c-.497.607-.563 1.414-.155 2.284l.265.562-4.257-4.257a.98.98 0 01-.117-.445c0-.267.104-.517.292-.706a1.023 1.023 0 011.41 0zm8.887 2.06c-.375-.557-.902-.916-1.486-1.011a1.738 1.738 0 00-1.342.332c-.376.29-.61.656-.712 1.065a2.1 2.1 0 00-1.095-.562 1.776 1.776 0 00-.992.128l-2.636-2.636a1.883 1.883 0 00-2.658 0 1.862 1.862 0 00-.478.847 1.886 1.886 0 00-2.671-.012 1.867 1.867 0 00-.503.909c-.754-.754-1.992-.754-2.703-.044a1.881 1.881 0 000 2.658c-.288.12-.605.288-.864.547a1.884 1.884 0 000 2.659l.624.622a1.879 1.879 0 00-.91 3.16l5.019 5.02c1.595 1.594 3.515 2.645 5.408 2.959a7.16 7.16 0 001.173.098c1.026 0 1.997-.24 2.892-.7.279.04.555.065.828.065 1.53 0 2.969-.628 4.236-1.894 3.338-3.338 3.083-6.928 1.738-9.166l-2.868-5.043z"/></g></svg></span></span><span class="button-activeState"><span class="svgIcon svgIcon--clapFilled svgIcon--25px is-flushLeft"><svg class="svgIcon-use" width="25" height="25" ><g fill-rule="evenodd"><path d="M11.738 0l.762 2.966L13.262 0z"/><path d="M16.634 1.224l-1.432-.47-.408 3.022z"/><path d="M9.79.754l-1.431.47 1.84 2.552z"/><path d="M22.472 13.307l-3.023-5.32c-.287-.426-.689-.705-1.123-.776a1.16 1.16 0 00-.911.221c-.297.231-.474.515-.535.84.017.022.036.04.053.063l2.843 5.001c1.95 3.564 1.328 6.973-1.843 10.144a8.46 8.46 0 01-.549.501c1.205-.156 2.328-.737 3.351-1.76 3.268-3.268 3.041-6.749 1.737-8.914"/><path d="M12.58 9.887c-.156-.83.096-1.569.692-2.142L10.78 5.252c-.5-.504-1.378-.504-1.879 0-.178.18-.273.4-.329.63l4.008 4.005z"/><path d="M15.812 9.04c-.218-.323-.539-.55-.88-.606a.814.814 0 00-.644.153c-.176.137-.713.553-.24 1.566l1.43 3.025a.539.539 0 11-.868.612L7.2 6.378a.986.986 0 10-1.395 1.395l4.401 4.403a.538.538 0 11-.762.762L5.046 8.54 3.802 7.295a.99.99 0 00-1.396 0 .981.981 0 000 1.394L3.647 9.93l4.402 4.403a.537.537 0 010 .761.535.535 0 01-.762 0L2.89 10.696a.992.992 0 00-1.399-.003.983.983 0 000 1.395l1.855 1.854 2.763 2.765a.538.538 0 01-.76.761l-2.765-2.764a.982.982 0 00-1.395 0 .989.989 0 000 1.395l5.32 5.32c3.371 3.372 6.64 4.977 10.49 1.126C19.74 19.8 20.271 17 18.62 13.982L15.812 9.04z"/></g></svg></span></span></button></div><span class="u-relative u-background js-actionMultirecommendCount u-marginLeft5"><button class="button button--chromeless u-baseColor--buttonNormal js-multirecommendCountButton u-disablePointerEvents" data-action="show-recommends" data-action-value="c0e993617118">1.6K</button></span></div></div><div class="buttonSet u-floatRight"><a class="button button--chromeless u-baseColor--buttonNormal" href="https://medium.com/flutter/introducing-google-fonts-for-flutter-v-1-0-0-c0e993617118?source=---------4-----------------------#--responses" data-action-source="---------4-----------------------">8 responses</a><button class="button button--dark button--chromeless is-touchIconFadeInPulse u-baseColor--buttonDark button--withIcon button--withSvgIcon button--bookmark js-bookmarkButton" data-action="add-to-bookmarks" data-action-value="c0e993617118"><span class="js-remove-from-bookmarks u-hide"><span class="svgIcon svgIcon--bookmarkFilled svgIcon--25px is-flushRight"><svg class="svgIcon-use" width="25" height="25" ><path d="M19 6c0-1.1-.9-2-2-2H8c-1.1 0-2 .9-2 2v14.66h.012c.01.103.045.204.12.285a.5.5 0 00.706.03L12.5 16.85l5.662 4.126c.205.183.52.17.708-.03a.5.5 0 00.118-.285H19V6z"/></svg></span></span><span class="js-add-to-bookmarks"><span class="svgIcon svgIcon--bookmarkAdd svgIcon--25px is-flushRight"><svg class="svgIcon-use" width="25" height="25" fill="none" ><path d="M18 2.5a.5.5 0 011 0V5h2.5a.5.5 0 010 1H19v2.5a.5.5 0 11-1 0V6h-2.5a.5.5 0 010-1H18V2.5z" fill="#292929"/><path d="M7 7a1 1 0 011-1h3.5a.5.5 0 000-1H8a2 2 0 00-2 2v14a.5.5 0 00.805.396L12.5 17l5.695 4.396A.5.5 0 0019 21v-8.5a.5.5 0 00-1 0v7.485l-5.195-4.012a.5.5 0 00-.61 0L7 19.985V7z" fill="#292929"/></svg></span></span></button></div></div></div></div></div><div class="streamItem streamItem--postPreview js-streamItem"><div class="cardChromeless u-marginTop20 u-paddingTop10 u-paddingBottom15 u-paddingLeft20 u-paddingRight20"><div class="postArticle postArticle--short js-postArticle js-trackPostPresentation js-trackPostScrolls" data-post-id="a285c6e3447d" data-source="---------5-----------------------"><div class="u-clearfix u-marginBottom15 u-paddingTop5"><div class="postMetaInline u-floatLeft u-sm-maxWidthFullWidth"><div class="u-flexCenter"><div class="postMetaInline-avatar u-flex0"><a class="link u-baseColor--link avatar" href="https://medium.com/@clocksmith" data-action="show-user-card" data-action-value="40a15fe2c58f" data-action-type="hover" data-user-id="40a15fe2c58f" dir="auto"><img src="https://cdn-images-1.medium.com/fit/c/72/72/1*fcJn7cFYnwInCzoug_PoDA.jpeg" class="avatar-image u-size36x36 u-xs-size32x32" alt="Go to the profile of Anthony Robledo"></a></div><div class="postMetaInline postMetaInline-authorLockup ui-captionStrong u-flex1 u-noWrapWithEllipsis"><a class="ds-link ds-link--styleSubtle link link--darken link--accent u-accentColor--textNormal u-accentColor--textDarken" href="https://medium.com/@clocksmith?source=---------5-----------------------" data-action="show-user-card" data-action-source="---------5-----------------------" data-action-value="40a15fe2c58f" data-action-type="hover" data-user-id="40a15fe2c58f" dir="auto">Anthony Robledo</a> in <a class="ds-link ds-link--styleSubtle link--darken link--accent u-accentColor--textNormal" href="https://medium.com/flutter?source=---------5-----------------------" data-action="show-collection-card" data-action-source="---------5-----------------------" data-action-value="flutter" data-action-type="hover">Flutter</a><div class="ui-caption u-fontSize12 u-baseColor--textNormal u-textColorNormal js-postMetaInlineSupplemental"><a class="link link--darken" href="https://medium.com/flutter/material-range-slider-in-flutter-a285c6e3447d?source=---------5-----------------------" data-action="open-post" data-action-value="https://medium.com/flutter/material-range-slider-in-flutter-a285c6e3447d?source=---------5-----------------------" data-action-source="preview-listing" ><time datetime="2019-07-11T15:06:31.420Z">Jul 11, 2019</time></a><span class="middotDivider u-fontSize12"></span><span class="readingTime" title="7 min read"></span></div></div></div></div></div><div><a class="" href="https://medium.com/flutter/material-range-slider-in-flutter-a285c6e3447d?source=---------5-----------------------" data-action-source="---------5-----------------------"><div class="postArticle-content js-postField"><section class="section section--body section--first section--last"><div class="section-divider"><hr class="section-divider"></div><div class="section-content"><div class="section-inner sectionLayout--insetColumn"><figure name="previewImage" id="previewImage" class="graf graf--figure graf--layoutCroppedHeightPreview graf--leading"><div class="aspectRatioPlaceholder is-locked"><div class="aspectRatioPlaceholder-fill" style="padding-bottom: 30%;"></div><img class="graf-image" data-image-id="0*wtmSldtwjSvtRtuI" data-width="1600" data-height="800" data-is-featured="true" src="https://cdn-images-1.medium.com/fit/t/1600/480/0*wtmSldtwjSvtRtuI"></div></figure><h3 name="previewTitle" id="previewTitle" class="graf graf--h3 graf-after--figure graf--title">Material Range Slider in Flutter</h3><h4 name="previewSubtitle" id="previewSubtitle" class="graf graf--h4 graf-after--h3 graf--trailing graf--subtitle">What is it? Why might you use it? How do you theme it?</h4></div></div></section></div></a></div><div class="postArticle-readMore"><a class="button button--smaller button--chromeless u-baseColor--buttonNormal" href="https://medium.com/flutter/material-range-slider-in-flutter-a285c6e3447d?source=---------5-----------------------" data-action="open-post" data-action-source="---------5-----------------------" data-action-value="https://medium.com/flutter/material-range-slider-in-flutter-a285c6e3447d?source=---------5-----------------------" data-post-id="a285c6e3447d">Read more…</a></div><div class="u-clearfix u-paddingTop10"><div class="u-floatLeft"><div class="multirecommend js-actionMultirecommend u-flexCenter" data-post-id="a285c6e3447d" data-is-flush-left="true" data-source="listing-----a285c6e3447d---------------------clap_preview"><div class="u-relative u-foreground"><button class="button button--primary button--chromeless u-accentColor--buttonNormal button--withIcon button--withSvgIcon clapButton js-actionMultirecommendButton clapButton--darker" data-action="sign-up-prompt" data-sign-in-action="multivote" data-requires-token="true" data-redirect="https://medium.com/_/vote/p/a285c6e3447d" data-action-source="listing-----a285c6e3447d---------------------clap_preview" aria-label="Clap"><span class="button-defaultState"><span class="svgIcon svgIcon--clap svgIcon--25px is-flushLeft"><svg class="svgIcon-use" width="25" height="25" ><g fill-rule="evenodd"><path d="M11.739 0l.761 2.966L13.261 0z"/><path d="M14.815 3.776l1.84-2.551-1.43-.471z"/><path d="M8.378 1.224l1.84 2.551L9.81.753z"/><path d="M20.382 21.622c-1.04 1.04-2.115 1.507-3.166 1.608.168-.14.332-.29.492-.45 2.885-2.886 3.456-5.982 1.69-9.211l-1.101-1.937-.955-2.02c-.315-.676-.235-1.185.245-1.556a.836.836 0 01.66-.16c.342.056.66.28.879.605l2.856 5.023c1.179 1.962 1.379 5.119-1.6 8.098m-13.29-.528l-5.02-5.02a1 1 0 01.707-1.701c.255 0 .512.098.707.292l2.607 2.607a.442.442 0 00.624-.624L4.11 14.04l-1.75-1.75a.998.998 0 111.41-1.413l4.154 4.156a.44.44 0 00.624 0 .44.44 0 000-.624l-4.152-4.153-1.172-1.171a.998.998 0 010-1.41 1.018 1.018 0 011.41 0l1.172 1.17 4.153 4.152a.437.437 0 00.624 0 .442.442 0 000-.624L6.43 8.222a.988.988 0 01-.291-.705.99.99 0 01.29-.706 1 1 0 011.412 0l6.992 6.993a.443.443 0 00.71-.501l-1.35-2.856c-.315-.676-.235-1.185.246-1.557a.85.85 0 01.66-.16c.342.056.659.28.879.606L18.628 14c1.573 2.876 1.067 5.545-1.544 8.156-1.396 1.397-3.144 1.966-5.063 1.652-1.713-.286-3.463-1.248-4.928-2.714zM10.99 5.976l2.562 2.562c-.497.607-.563 1.414-.155 2.284l.265.562-4.257-4.257a.98.98 0 01-.117-.445c0-.267.104-.517.292-.706a1.023 1.023 0 011.41 0zm8.887 2.06c-.375-.557-.902-.916-1.486-1.011a1.738 1.738 0 00-1.342.332c-.376.29-.61.656-.712 1.065a2.1 2.1 0 00-1.095-.562 1.776 1.776 0 00-.992.128l-2.636-2.636a1.883 1.883 0 00-2.658 0 1.862 1.862 0 00-.478.847 1.886 1.886 0 00-2.671-.012 1.867 1.867 0 00-.503.909c-.754-.754-1.992-.754-2.703-.044a1.881 1.881 0 000 2.658c-.288.12-.605.288-.864.547a1.884 1.884 0 000 2.659l.624.622a1.879 1.879 0 00-.91 3.16l5.019 5.02c1.595 1.594 3.515 2.645 5.408 2.959a7.16 7.16 0 001.173.098c1.026 0 1.997-.24 2.892-.7.279.04.555.065.828.065 1.53 0 2.969-.628 4.236-1.894 3.338-3.338 3.083-6.928 1.738-9.166l-2.868-5.043z"/></g></svg></span></span><span class="button-activeState"><span class="svgIcon svgIcon--clapFilled svgIcon--25px is-flushLeft"><svg class="svgIcon-use" width="25" height="25" ><g fill-rule="evenodd"><path d="M11.738 0l.762 2.966L13.262 0z"/><path d="M16.634 1.224l-1.432-.47-.408 3.022z"/><path d="M9.79.754l-1.431.47 1.84 2.552z"/><path d="M22.472 13.307l-3.023-5.32c-.287-.426-.689-.705-1.123-.776a1.16 1.16 0 00-.911.221c-.297.231-.474.515-.535.84.017.022.036.04.053.063l2.843 5.001c1.95 3.564 1.328 6.973-1.843 10.144a8.46 8.46 0 01-.549.501c1.205-.156 2.328-.737 3.351-1.76 3.268-3.268 3.041-6.749 1.737-8.914"/><path d="M12.58 9.887c-.156-.83.096-1.569.692-2.142L10.78 5.252c-.5-.504-1.378-.504-1.879 0-.178.18-.273.4-.329.63l4.008 4.005z"/><path d="M15.812 9.04c-.218-.323-.539-.55-.88-.606a.814.814 0 00-.644.153c-.176.137-.713.553-.24 1.566l1.43 3.025a.539.539 0 11-.868.612L7.2 6.378a.986.986 0 10-1.395 1.395l4.401 4.403a.538.538 0 11-.762.762L5.046 8.54 3.802 7.295a.99.99 0 00-1.396 0 .981.981 0 000 1.394L3.647 9.93l4.402 4.403a.537.537 0 010 .761.535.535 0 01-.762 0L2.89 10.696a.992.992 0 00-1.399-.003.983.983 0 000 1.395l1.855 1.854 2.763 2.765a.538.538 0 01-.76.761l-2.765-2.764a.982.982 0 00-1.395 0 .989.989 0 000 1.395l5.32 5.32c3.371 3.372 6.64 4.977 10.49 1.126C19.74 19.8 20.271 17 18.62 13.982L15.812 9.04z"/></g></svg></span></span></button></div><span class="u-relative u-background js-actionMultirecommendCount u-marginLeft5"><button class="button button--chromeless u-baseColor--buttonNormal js-multirecommendCountButton u-disablePointerEvents" data-action="show-recommends" data-action-value="a285c6e3447d">1.5K</button></span></div></div><div class="buttonSet u-floatRight"><a class="button button--chromeless u-baseColor--buttonNormal" href="https://medium.com/flutter/material-range-slider-in-flutter-a285c6e3447d?source=---------5-----------------------#--responses" data-action-source="---------5-----------------------">6 responses</a><button class="button button--dark button--chromeless is-touchIconFadeInPulse u-baseColor--buttonDark button--withIcon button--withSvgIcon button--bookmark js-bookmarkButton" data-action="add-to-bookmarks" data-action-value="a285c6e3447d"><span class="js-remove-from-bookmarks u-hide"><span class="svgIcon svgIcon--bookmarkFilled svgIcon--25px is-flushRight"><svg class="svgIcon-use" width="25" height="25" ><path d="M19 6c0-1.1-.9-2-2-2H8c-1.1 0-2 .9-2 2v14.66h.012c.01.103.045.204.12.285a.5.5 0 00.706.03L12.5 16.85l5.662 4.126c.205.183.52.17.708-.03a.5.5 0 00.118-.285H19V6z"/></svg></span></span><span class="js-add-to-bookmarks"><span class="svgIcon svgIcon--bookmarkAdd svgIcon--25px is-flushRight"><svg class="svgIcon-use" width="25" height="25" fill="none" ><path d="M18 2.5a.5.5 0 011 0V5h2.5a.5.5 0 010 1H19v2.5a.5.5 0 11-1 0V6h-2.5a.5.5 0 010-1H18V2.5z" fill="#292929"/><path d="M7 7a1 1 0 011-1h3.5a.5.5 0 000-1H8a2 2 0 00-2 2v14a.5.5 0 00.805.396L12.5 17l5.695 4.396A.5.5 0 0019 21v-8.5a.5.5 0 00-1 0v7.485l-5.195-4.012a.5.5 0 00-.61 0L7 19.985V7z" fill="#292929"/></svg></span></span></button></div></div></div></div></div><div class="streamItem streamItem--postPreview js-streamItem"><div class="cardChromeless u-marginTop20 u-paddingTop10 u-paddingBottom15 u-paddingLeft20 u-paddingRight20"><div class="postArticle postArticle--short js-postArticle js-trackPostPresentation js-trackPostScrolls" data-post-id="13ae9279ef19" data-source="---------6-----------------------"><div class="u-clearfix u-marginBottom15 u-paddingTop5"><div class="postMetaInline u-floatLeft u-sm-maxWidthFullWidth"><div class="u-flexCenter"><div class="postMetaInline-avatar u-flex0"><a class="link u-baseColor--link avatar" href="https://medium.com/@mit.mit" data-action="show-user-card" data-action-value="a6d788faa5e5" data-action-type="hover" data-user-id="a6d788faa5e5" dir="auto"><img src="https://cdn-images-1.medium.com/fit/c/72/72/0*Y_CFLc1qadgr3tPK." class="avatar-image u-size36x36 u-xs-size32x32" alt="Go to the profile of Michael Thomsen"></a></div><div class="postMetaInline postMetaInline-authorLockup ui-captionStrong u-flex1 u-noWrapWithEllipsis"><a class="ds-link ds-link--styleSubtle link link--darken link--accent u-accentColor--textNormal u-accentColor--textDarken" href="https://medium.com/@mit.mit?source=---------6-----------------------" data-action="show-user-card" data-action-source="---------6-----------------------" data-action-value="a6d788faa5e5" data-action-type="hover" data-user-id="a6d788faa5e5" dir="auto">Michael Thomsen</a> in <a class="ds-link ds-link--styleSubtle link--darken link--accent u-accentColor--textNormal" href="https://medium.com/flutter?source=---------6-----------------------" data-action="show-collection-card" data-action-source="---------6-----------------------" data-action-value="flutter" data-action-type="hover">Flutter</a><div class="ui-caption u-fontSize12 u-baseColor--textNormal u-textColorNormal js-postMetaInlineSupplemental"><a class="link link--darken" href="https://medium.com/flutter/building-beautiful-flexible-user-interfaces-with-flutter-material-theming-and-official-material-13ae9279ef19?source=---------6-----------------------" data-action="open-post" data-action-value="https://medium.com/flutter/building-beautiful-flexible-user-interfaces-with-flutter-material-theming-and-official-material-13ae9279ef19?source=---------6-----------------------" data-action-source="preview-listing" ><time datetime="2018-05-10T19:11:32.163Z">May 10, 2018</time></a><span class="middotDivider u-fontSize12"></span><span class="readingTime" title="3 min read"></span></div></div></div></div></div><div><a class="" href="https://medium.com/flutter/building-beautiful-flexible-user-interfaces-with-flutter-material-theming-and-official-material-13ae9279ef19?source=---------6-----------------------" data-action-source="---------6-----------------------"><div class="postArticle-content js-postField"><section class="section section--body section--first section--last"><div class="section-divider"><hr class="section-divider"></div><div class="section-content"><div class="section-inner sectionLayout--insetColumn"><h3 name="ba48" id="ba48" class="graf graf--h3 graf--leading graf--title">Building beautiful, flexible user interfaces with Flutter, Material Theming, and official Material Components (MDC)</h3><p name="4e2e" id="4e2e" class="graf graf--p graf-after--h3 graf--trailing">At <span class="markup--anchor markup--p-anchor" data-action="open-inner-link" data-action-value="https://events.google.com/io/">Google I/O 2018</a>, the Material team <span class="markup--anchor markup--p-anchor" data-action="open-inner-link" data-action-value="https://design.google/library/making-more-with-material/">announced</a> a important update to Material Design, with a strong focus on enabling mobile apps to…</p></div></div></section></div></a></div><div class="postArticle-readMore"><a class="button button--smaller button--chromeless u-baseColor--buttonNormal" href="https://medium.com/flutter/building-beautiful-flexible-user-interfaces-with-flutter-material-theming-and-official-material-13ae9279ef19?source=---------6-----------------------" data-action="open-post" data-action-source="---------6-----------------------" data-action-value="https://medium.com/flutter/building-beautiful-flexible-user-interfaces-with-flutter-material-theming-and-official-material-13ae9279ef19?source=---------6-----------------------" data-post-id="13ae9279ef19">Read more…</a></div><div class="u-clearfix u-paddingTop10"><div class="u-floatLeft"><div class="multirecommend js-actionMultirecommend u-flexCenter" data-post-id="13ae9279ef19" data-is-flush-left="true" data-source="listing-----13ae9279ef19---------------------clap_preview"><div class="u-relative u-foreground"><button class="button button--primary button--chromeless u-accentColor--buttonNormal button--withIcon button--withSvgIcon clapButton js-actionMultirecommendButton clapButton--darker" data-action="sign-up-prompt" data-sign-in-action="multivote" data-requires-token="true" data-redirect="https://medium.com/_/vote/p/13ae9279ef19" data-action-source="listing-----13ae9279ef19---------------------clap_preview" aria-label="Clap"><span class="button-defaultState"><span class="svgIcon svgIcon--clap svgIcon--25px is-flushLeft"><svg class="svgIcon-use" width="25" height="25" ><g fill-rule="evenodd"><path d="M11.739 0l.761 2.966L13.261 0z"/><path d="M14.815 3.776l1.84-2.551-1.43-.471z"/><path d="M8.378 1.224l1.84 2.551L9.81.753z"/><path d="M20.382 21.622c-1.04 1.04-2.115 1.507-3.166 1.608.168-.14.332-.29.492-.45 2.885-2.886 3.456-5.982 1.69-9.211l-1.101-1.937-.955-2.02c-.315-.676-.235-1.185.245-1.556a.836.836 0 01.66-.16c.342.056.66.28.879.605l2.856 5.023c1.179 1.962 1.379 5.119-1.6 8.098m-13.29-.528l-5.02-5.02a1 1 0 01.707-1.701c.255 0 .512.098.707.292l2.607 2.607a.442.442 0 00.624-.624L4.11 14.04l-1.75-1.75a.998.998 0 111.41-1.413l4.154 4.156a.44.44 0 00.624 0 .44.44 0 000-.624l-4.152-4.153-1.172-1.171a.998.998 0 010-1.41 1.018 1.018 0 011.41 0l1.172 1.17 4.153 4.152a.437.437 0 00.624 0 .442.442 0 000-.624L6.43 8.222a.988.988 0 01-.291-.705.99.99 0 01.29-.706 1 1 0 011.412 0l6.992 6.993a.443.443 0 00.71-.501l-1.35-2.856c-.315-.676-.235-1.185.246-1.557a.85.85 0 01.66-.16c.342.056.659.28.879.606L18.628 14c1.573 2.876 1.067 5.545-1.544 8.156-1.396 1.397-3.144 1.966-5.063 1.652-1.713-.286-3.463-1.248-4.928-2.714zM10.99 5.976l2.562 2.562c-.497.607-.563 1.414-.155 2.284l.265.562-4.257-4.257a.98.98 0 01-.117-.445c0-.267.104-.517.292-.706a1.023 1.023 0 011.41 0zm8.887 2.06c-.375-.557-.902-.916-1.486-1.011a1.738 1.738 0 00-1.342.332c-.376.29-.61.656-.712 1.065a2.1 2.1 0 00-1.095-.562 1.776 1.776 0 00-.992.128l-2.636-2.636a1.883 1.883 0 00-2.658 0 1.862 1.862 0 00-.478.847 1.886 1.886 0 00-2.671-.012 1.867 1.867 0 00-.503.909c-.754-.754-1.992-.754-2.703-.044a1.881 1.881 0 000 2.658c-.288.12-.605.288-.864.547a1.884 1.884 0 000 2.659l.624.622a1.879 1.879 0 00-.91 3.16l5.019 5.02c1.595 1.594 3.515 2.645 5.408 2.959a7.16 7.16 0 001.173.098c1.026 0 1.997-.24 2.892-.7.279.04.555.065.828.065 1.53 0 2.969-.628 4.236-1.894 3.338-3.338 3.083-6.928 1.738-9.166l-2.868-5.043z"/></g></svg></span></span><span class="button-activeState"><span class="svgIcon svgIcon--clapFilled svgIcon--25px is-flushLeft"><svg class="svgIcon-use" width="25" height="25" ><g fill-rule="evenodd"><path d="M11.738 0l.762 2.966L13.262 0z"/><path d="M16.634 1.224l-1.432-.47-.408 3.022z"/><path d="M9.79.754l-1.431.47 1.84 2.552z"/><path d="M22.472 13.307l-3.023-5.32c-.287-.426-.689-.705-1.123-.776a1.16 1.16 0 00-.911.221c-.297.231-.474.515-.535.84.017.022.036.04.053.063l2.843 5.001c1.95 3.564 1.328 6.973-1.843 10.144a8.46 8.46 0 01-.549.501c1.205-.156 2.328-.737 3.351-1.76 3.268-3.268 3.041-6.749 1.737-8.914"/><path d="M12.58 9.887c-.156-.83.096-1.569.692-2.142L10.78 5.252c-.5-.504-1.378-.504-1.879 0-.178.18-.273.4-.329.63l4.008 4.005z"/><path d="M15.812 9.04c-.218-.323-.539-.55-.88-.606a.814.814 0 00-.644.153c-.176.137-.713.553-.24 1.566l1.43 3.025a.539.539 0 11-.868.612L7.2 6.378a.986.986 0 10-1.395 1.395l4.401 4.403a.538.538 0 11-.762.762L5.046 8.54 3.802 7.295a.99.99 0 00-1.396 0 .981.981 0 000 1.394L3.647 9.93l4.402 4.403a.537.537 0 010 .761.535.535 0 01-.762 0L2.89 10.696a.992.992 0 00-1.399-.003.983.983 0 000 1.395l1.855 1.854 2.763 2.765a.538.538 0 01-.76.761l-2.765-2.764a.982.982 0 00-1.395 0 .989.989 0 000 1.395l5.32 5.32c3.371 3.372 6.64 4.977 10.49 1.126C19.74 19.8 20.271 17 18.62 13.982L15.812 9.04z"/></g></svg></span></span></button></div><span class="u-relative u-background js-actionMultirecommendCount u-marginLeft5"><button class="button button--chromeless u-baseColor--buttonNormal js-multirecommendCountButton u-disablePointerEvents" data-action="show-recommends" data-action-value="13ae9279ef19">1.5K</button></span></div></div><div class="buttonSet u-floatRight"><a class="button button--chromeless u-baseColor--buttonNormal" href="https://medium.com/flutter/building-beautiful-flexible-user-interfaces-with-flutter-material-theming-and-official-material-13ae9279ef19?source=---------6-----------------------#--responses" data-action-source="---------6-----------------------">1 response</a><button class="button button--dark button--chromeless is-touchIconFadeInPulse u-baseColor--buttonDark button--withIcon button--withSvgIcon button--bookmark js-bookmarkButton" data-action="add-to-bookmarks" data-action-value="13ae9279ef19"><span class="js-remove-from-bookmarks u-hide"><span class="svgIcon svgIcon--bookmarkFilled svgIcon--25px is-flushRight"><svg class="svgIcon-use" width="25" height="25" ><path d="M19 6c0-1.1-.9-2-2-2H8c-1.1 0-2 .9-2 2v14.66h.012c.01.103.045.204.12.285a.5.5 0 00.706.03L12.5 16.85l5.662 4.126c.205.183.52.17.708-.03a.5.5 0 00.118-.285H19V6z"/></svg></span></span><span class="js-add-to-bookmarks"><span class="svgIcon svgIcon--bookmarkAdd svgIcon--25px is-flushRight"><svg class="svgIcon-use" width="25" height="25" fill="none" ><path d="M18 2.5a.5.5 0 011 0V5h2.5a.5.5 0 010 1H19v2.5a.5.5 0 11-1 0V6h-2.5a.5.5 0 010-1H18V2.5z" fill="#292929"/><path d="M7 7a1 1 0 011-1h3.5a.5.5 0 000-1H8a2 2 0 00-2 2v14a.5.5 0 00.805.396L12.5 17l5.695 4.396A.5.5 0 0019 21v-8.5a.5.5 0 00-1 0v7.485l-5.195-4.012a.5.5 0 00-.61 0L7 19.985V7z" fill="#292929"/></svg></span></span></button></div></div></div></div></div></div></div></div></div></div></div><style class="js-collectionStyle"> .u-accentColor--borderLight {border-color: #498BD1 !important;} .u-accentColor--borderNormal {border-color: #498BD1 !important;} .u-accentColor--borderDark {border-color: #4477AF !important;} .u-accentColor--iconLight .svgIcon,.u-accentColor--iconLight.svgIcon {fill: #498BD1 !important;} .u-accentColor--iconNormal .svgIcon,.u-accentColor--iconNormal.svgIcon {fill: #498BD1 !important;} .u-accentColor--iconDark .svgIcon,.u-accentColor--iconDark.svgIcon {fill: #4477AF !important;} .u-accentColor--textNormal {color: #4477AF !important;} .u-accentColor--hoverTextNormal:hover {color: #4477AF !important;} .u-accentColor--textNormal.u-accentColor--textDarken:hover {color: #416D9E !important;} .u-accentColor--textDark {color: #416D9E !important;} .u-accentColor--backgroundLight {background-color: #498BD1 !important;} .u-accentColor--backgroundNormal {background-color: #498BD1 !important;} .u-accentColor--backgroundDark {background-color: #4477AF !important;} .u-accentColor--buttonDark {border-color: #4477AF !important; color: #416D9E !important;} .u-accentColor--buttonDark:hover {border-color: #416D9E !important;} .u-accentColor--buttonDark .icon:before,.u-accentColor--buttonDark .svgIcon{color: #4477AF !important; fill: #4477AF !important;} .u-accentColor--buttonNormal:not(.clapButton--largePill) {border-color: #498BD1 !important; color: #4477AF !important;} .u-accentColor--buttonNormal:hover {border-color: #4477AF !important;} .u-accentColor--buttonNormal .icon:before,.u-accentColor--buttonNormal .svgIcon{color: #498BD1 !important; fill: #498BD1 !important;} .u-accentColor--buttonNormal.button--filled .icon:before,.u-accentColor--buttonNormal.button--filled .svgIcon{color: rgba(255, 255, 255, 1) !important; fill: rgba(255, 255, 255, 1) !important;} .u-accentColor--buttonDark.button--filled,.u-accentColor--buttonDark.button--withChrome.is-active,.u-accentColor--fillWhenActive.is-active {background-color: #4477AF !important; border-color: #4477AF !important; color: rgba(255, 255, 255, 1) !important; fill: rgba(255, 255, 255, 1) !important;} .u-accentColor--buttonNormal.button--filled:not(.clapButton--largePill),.u-accentColor--buttonNormal.button--withChrome.is-active:not(.clapButton--largePill) {background-color: #498BD1 !important; border-color: #498BD1 !important; color: rgba(255, 255, 255, 1) !important; fill: rgba(255, 255, 255, 1) !important;} .postArticle.is-withAccentColors .markup--user,.postArticle.is-withAccentColors .markup--query {color: #4477AF !important;}.u-tintBgColor {background-color: rgba(1, 87, 155, 1) !important;}.u-tintBgColor .u-fadeLeft:before {background-image: linear-gradient(to right, rgba(1, 87, 155, 1) 0%, rgba(1, 87, 155, 0) 100%) !important;}.u-tintBgColor .u-fadeRight:after {background-image: linear-gradient(to right, rgba(1, 87, 155, 0) 0%, rgba(1, 87, 155, 1) 100%) !important;} .u-tintSpectrum .u-baseColor--borderLight {border-color: #92B4DC !important;} .u-tintSpectrum .u-baseColor--borderNormal {border-color: #BCD3F1 !important;} .u-tintSpectrum .u-baseColor--borderDark {border-color: #E3F2FF !important;} .u-tintSpectrum .u-baseColor--iconLight .svgIcon,.u-tintSpectrum .u-baseColor--iconLight.svgIcon {fill: #92B4DC !important;} .u-tintSpectrum .u-baseColor--iconNormal .svgIcon,.u-tintSpectrum .u-baseColor--iconNormal.svgIcon {fill: #BCD3F1 !important;} .u-tintSpectrum .u-baseColor--iconDark .svgIcon,.u-tintSpectrum .u-baseColor--iconDark.svgIcon {fill: #E3F2FF !important;} .u-tintSpectrum .u-baseColor--textNormal {color: #BCD3F1 !important;} .u-tintSpectrum .u-baseColor--textNormal.u-baseColor--textDarken:hover {color: #F7FFFF !important;} .u-tintSpectrum .u-baseColor--textDark {color: #F7FFFF !important;} .u-tintSpectrum .u-baseColor--textDarker {color: #F7FFFF !important;} .u-tintSpectrum .u-baseColor--backgroundLight {background-color: #92B4DC !important;} .u-tintSpectrum .u-baseColor--backgroundNormal {background-color: #BCD3F1 !important;} .u-tintSpectrum .u-baseColor--backgroundDark {background-color: #E3F2FF !important;} .u-tintSpectrum .u-baseColor--buttonLight {border-color: #92B4DC !important; color: #92B4DC !important;} .u-tintSpectrum .u-baseColor--buttonLight:hover {border-color: #92B4DC !important;} .u-tintSpectrum .u-baseColor--buttonLight .icon:before,.u-tintSpectrum .u-baseColor--buttonLight .svgIcon {color: #92B4DC !important; fill: #92B4DC !important;} .u-tintSpectrum .u-baseColor--buttonDark {border-color: #E3F2FF !important; color: #F7FFFF !important;} .u-tintSpectrum .u-baseColor--buttonDark:hover {border-color: #F7FFFF !important;} .u-tintSpectrum .u-baseColor--buttonDark .icon:before,.u-tintSpectrum .u-baseColor--buttonDark .svgIcon {color: #E3F2FF !important; fill: #E3F2FF !important;} .u-tintSpectrum .u-baseColor--buttonNormal {border-color: #BCD3F1 !important; color: #BCD3F1 !important;} .u-tintSpectrum .u-baseColor--buttonNormal:hover {border-color: #E3F2FF !important;} .u-tintSpectrum .u-baseColor--buttonNormal .icon:before,.u-tintSpectrum .u-baseColor--buttonNormal .svgIcon {color: #BCD3F1 !important; fill: #BCD3F1 !important;} .u-tintSpectrum .u-baseColor--buttonDark.button--filled,.u-tintSpectrum .u-baseColor--buttonDark.button--withChrome.is-active {background-color: #E3F2FF !important; border-color: #E3F2FF !important; color: rgba(1, 87, 155, 1) !important; fill: rgba(1, 87, 155, 1) !important;} .u-tintSpectrum .u-baseColor--buttonNormal.button--filled,.u-tintSpectrum .u-baseColor--buttonNormal.button--withChrome.is-active {background-color: #BCD3F1 !important; border-color: #BCD3F1 !important; color: rgba(1, 87, 155, 1) !important; fill: rgba(1, 87, 155, 1) !important;} .u-tintSpectrum .u-baseColor--link {color: #BCD3F1 !important;} .u-tintSpectrum .u-baseColor--link.link--darkenOnHover:hover {color: #F7FFFF !important;} .u-tintSpectrum .u-baseColor--link.link--darken:hover,.u-tintSpectrum .u-baseColor--link.link--darken:focus,.u-tintSpectrum .u-baseColor--link.link--darken:active {color: #F7FFFF !important;} .u-tintSpectrum .u-baseColor--link.link--dark {color: #F7FFFF !important;} .u-tintSpectrum .u-baseColor--link.link--dark.link--darken:hover,.u-tintSpectrum .u-baseColor--link.link--dark.link--darken:focus,.u-tintSpectrum .u-baseColor--link.link--dark.link--darken:active {color: #F7FFFF !important;} .u-tintSpectrum .u-baseColor--link.link--darker {color: #F7FFFF !important;} .u-tintSpectrum .u-baseColor--placeholderNormal ::-webkit-input-placeholder {color: #92B4DC;} .u-tintSpectrum .u-baseColor--placeholderNormal ::-moz-placeholder {color: #92B4DC;} .u-tintSpectrum .u-baseColor--placeholderNormal :-ms-input-placeholder {color: #92B4DC;} .u-tintSpectrum .ui-h1,.u-tintSpectrum .ui-h2,.u-tintSpectrum .ui-h3,.u-tintSpectrum .ui-h4,.u-tintSpectrum .ui-brand1,.u-tintSpectrum .ui-brand2,.u-tintSpectrum .ui-captionStrong {color: #F7FFFF !important; fill: #F7FFFF !important;} .u-tintSpectrum .ui-body,.u-tintSpectrum .ui-caps {color: #F7FFFF !important; fill: #F7FFFF !important;} .u-tintSpectrum .ui-summary,.u-tintSpectrum .ui-caption {color: #92B4DC !important; fill: #92B4DC !important;} .u-tintSpectrum .u-accentColor--borderLight {border-color: #92B4DC !important;} .u-tintSpectrum .u-accentColor--borderNormal {border-color: #BCD3F1 !important;} .u-tintSpectrum .u-accentColor--borderDark {border-color: #E3F2FF !important;} .u-tintSpectrum .u-accentColor--iconLight .svgIcon,.u-tintSpectrum .u-accentColor--iconLight.svgIcon {fill: #92B4DC !important;} .u-tintSpectrum .u-accentColor--iconNormal .svgIcon,.u-tintSpectrum .u-accentColor--iconNormal.svgIcon {fill: #BCD3F1 !important;} .u-tintSpectrum .u-accentColor--iconDark .svgIcon,.u-tintSpectrum .u-accentColor--iconDark.svgIcon {fill: #E3F2FF !important;} .u-tintSpectrum .u-accentColor--textNormal {color: #BCD3F1 !important;} .u-tintSpectrum .u-accentColor--hoverTextNormal:hover {color: #BCD3F1 !important;} .u-tintSpectrum .u-accentColor--textNormal.u-accentColor--textDarken:hover {color: #F7FFFF !important;} .u-tintSpectrum .u-accentColor--textDark {color: #F7FFFF !important;} .u-tintSpectrum .u-accentColor--backgroundLight {background-color: #92B4DC !important;} .u-tintSpectrum .u-accentColor--backgroundNormal {background-color: #BCD3F1 !important;} .u-tintSpectrum .u-accentColor--backgroundDark {background-color: #E3F2FF !important;} .u-tintSpectrum .u-accentColor--buttonDark {border-color: #E3F2FF !important; color: #F7FFFF !important;} .u-tintSpectrum .u-accentColor--buttonDark:hover {border-color: #F7FFFF !important;} .u-tintSpectrum .u-accentColor--buttonDark .icon:before,.u-tintSpectrum .u-accentColor--buttonDark .svgIcon{color: #E3F2FF !important; fill: #E3F2FF !important;} .u-tintSpectrum .u-accentColor--buttonNormal:not(.clapButton--largePill) {border-color: #BCD3F1 !important; color: #BCD3F1 !important;} .u-tintSpectrum .u-accentColor--buttonNormal:hover {border-color: #E3F2FF !important;} .u-tintSpectrum .u-accentColor--buttonNormal .icon:before,.u-tintSpectrum .u-accentColor--buttonNormal .svgIcon{color: #BCD3F1 !important; fill: #BCD3F1 !important;} .u-tintSpectrum .u-accentColor--buttonNormal.button--filled .icon:before,.u-tintSpectrum .u-accentColor--buttonNormal.button--filled .svgIcon{color: rgba(1, 87, 155, 1) !important; fill: rgba(1, 87, 155, 1) !important;} .u-tintSpectrum .u-accentColor--buttonDark.button--filled,.u-tintSpectrum .u-accentColor--buttonDark.button--withChrome.is-active,.u-tintSpectrum .u-accentColor--fillWhenActive.is-active {background-color: #E3F2FF !important; border-color: #E3F2FF !important; color: rgba(1, 87, 155, 1) !important; fill: rgba(1, 87, 155, 1) !important;} .u-tintSpectrum .u-accentColor--buttonNormal.button--filled:not(.clapButton--largePill),.u-tintSpectrum .u-accentColor--buttonNormal.button--withChrome.is-active:not(.clapButton--largePill) {background-color: #BCD3F1 !important; border-color: #BCD3F1 !important; color: rgba(1, 87, 155, 1) !important; fill: rgba(1, 87, 155, 1) !important;} .u-tintSpectrum .postArticle.is-withAccentColors .markup--user,.u-tintSpectrum .postArticle.is-withAccentColors .markup--query {color: #BCD3F1 !important;} .u-accentColor--highlightFaint {background-color: rgba(227, 243, 255, 1) !important;} .u-accentColor--highlightStrong.is-active .svgIcon {fill: rgba(182, 230, 255, 1) !important;} .postArticle.is-withAccentColors .markup--quote.is-other {background-color: rgba(227, 243, 255, 1) !important;} body.is-withMagicUnderlines .postArticle.is-withAccentColors .markup--quote.is-other {background-color: transparent !important; background-image: linear-gradient(to bottom, rgba(227, 243, 255, 1), rgba(227, 243, 255, 1));} .postArticle.is-withAccentColors .markup--quote.is-me {background-color: rgba(203, 236, 255, 1) !important;} body.is-withMagicUnderlines .postArticle.is-withAccentColors .markup--quote.is-me {background-color: transparent !important; background-image: linear-gradient(to bottom, rgba(203, 236, 255, 1), rgba(203, 236, 255, 1));} .postArticle.is-withAccentColors .markup--quote.is-targeted {background-color: rgba(182, 230, 255, 1) !important;} body.is-withMagicUnderlines .postArticle.is-withAccentColors .markup--quote.is-targeted {background-color: transparent !important; background-image: linear-gradient(to bottom, rgba(182, 230, 255, 1), rgba(182, 230, 255, 1));} .postArticle.is-withAccentColors .markup--quote.is-selected {background-color: rgba(182, 230, 255, 1) !important;} body.is-withMagicUnderlines .postArticle.is-withAccentColors .markup--quote.is-selected {background-color: transparent !important; background-image: linear-gradient(to bottom, rgba(182, 230, 255, 1), rgba(182, 230, 255, 1));} .postArticle.is-withAccentColors .markup--highlight {background-color: rgba(182, 230, 255, 1) !important;} body.is-withMagicUnderlines .postArticle.is-withAccentColors .markup--highlight {background-color: transparent !important; background-image: linear-gradient(to bottom, rgba(182, 230, 255, 1), rgba(182, 230, 255, 1));}</style><style class="js-collectionStyleConstant">.u-imageBgColor {background-color: rgba(0, 0, 0, 0.24705882352941178);} .u-imageSpectrum .u-baseColor--borderLight {border-color: rgba(255, 255, 255, 0.6980392156862745) !important;} .u-imageSpectrum .u-baseColor--borderNormal {border-color: rgba(255, 255, 255, 0.8980392156862745) !important;} .u-imageSpectrum .u-baseColor--borderDark {border-color: rgba(255, 255, 255, 0.9490196078431372) !important;} .u-imageSpectrum .u-baseColor--iconLight .svgIcon,.u-imageSpectrum .u-baseColor--iconLight.svgIcon {fill: rgba(255, 255, 255, 0.8) !important;} .u-imageSpectrum .u-baseColor--iconNormal .svgIcon,.u-imageSpectrum .u-baseColor--iconNormal.svgIcon {fill: rgba(255, 255, 255, 0.9490196078431372) !important;} .u-imageSpectrum .u-baseColor--iconDark .svgIcon,.u-imageSpectrum .u-baseColor--iconDark.svgIcon {fill: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .u-baseColor--textNormal {color: rgba(255, 255, 255, 0.9490196078431372) !important;} .u-imageSpectrum .u-baseColor--textNormal.u-baseColor--textDarken:hover {color: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .u-baseColor--textDark {color: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .u-baseColor--textDarker {color: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .u-baseColor--backgroundLight {background-color: rgba(255, 255, 255, 0.8980392156862745) !important;} .u-imageSpectrum .u-baseColor--backgroundNormal {background-color: rgba(255, 255, 255, 0.9490196078431372) !important;} .u-imageSpectrum .u-baseColor--backgroundDark {background-color: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .u-baseColor--buttonLight {border-color: rgba(255, 255, 255, 0.6980392156862745) !important; color: rgba(255, 255, 255, 0.8) !important;} .u-imageSpectrum .u-baseColor--buttonLight:hover {border-color: rgba(255, 255, 255, 0.6980392156862745) !important;} .u-imageSpectrum .u-baseColor--buttonLight .icon:before,.u-imageSpectrum .u-baseColor--buttonLight .svgIcon {color: rgba(255, 255, 255, 0.8) !important; fill: rgba(255, 255, 255, 0.8) !important;} .u-imageSpectrum .u-baseColor--buttonDark {border-color: rgba(255, 255, 255, 0.9490196078431372) !important; color: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .u-baseColor--buttonDark:hover {border-color: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .u-baseColor--buttonDark .icon:before,.u-imageSpectrum .u-baseColor--buttonDark .svgIcon {color: rgba(255, 255, 255, 1) !important; fill: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .u-baseColor--buttonNormal {border-color: rgba(255, 255, 255, 0.8980392156862745) !important; color: rgba(255, 255, 255, 0.9490196078431372) !important;} .u-imageSpectrum .u-baseColor--buttonNormal:hover {border-color: rgba(255, 255, 255, 0.9490196078431372) !important;} .u-imageSpectrum .u-baseColor--buttonNormal .icon:before,.u-imageSpectrum .u-baseColor--buttonNormal .svgIcon {color: rgba(255, 255, 255, 0.9490196078431372) !important; fill: rgba(255, 255, 255, 0.9490196078431372) !important;} .u-imageSpectrum .u-baseColor--buttonDark.button--filled,.u-imageSpectrum .u-baseColor--buttonDark.button--withChrome.is-active {background-color: rgba(255, 255, 255, 1) !important; border-color: rgba(255, 255, 255, 1) !important; color: rgba(0, 0, 0, 0.24705882352941178) !important; fill: rgba(0, 0, 0, 0.24705882352941178) !important;} .u-imageSpectrum .u-baseColor--buttonNormal.button--filled,.u-imageSpectrum .u-baseColor--buttonNormal.button--withChrome.is-active {background-color: rgba(255, 255, 255, 0.9490196078431372) !important; border-color: rgba(255, 255, 255, 0.9490196078431372) !important; color: rgba(0, 0, 0, 0.24705882352941178) !important; fill: rgba(0, 0, 0, 0.24705882352941178) !important;} .u-imageSpectrum .u-baseColor--link {color: rgba(255, 255, 255, 0.9490196078431372) !important;} .u-imageSpectrum .u-baseColor--link.link--darkenOnHover:hover {color: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .u-baseColor--link.link--darken:hover,.u-imageSpectrum .u-baseColor--link.link--darken:focus,.u-imageSpectrum .u-baseColor--link.link--darken:active {color: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .u-baseColor--link.link--dark {color: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .u-baseColor--link.link--dark.link--darken:hover,.u-imageSpectrum .u-baseColor--link.link--dark.link--darken:focus,.u-imageSpectrum .u-baseColor--link.link--dark.link--darken:active {color: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .u-baseColor--link.link--darker {color: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .u-baseColor--placeholderNormal ::-webkit-input-placeholder {color: rgba(255, 255, 255, 0.8);} .u-imageSpectrum .u-baseColor--placeholderNormal ::-moz-placeholder {color: rgba(255, 255, 255, 0.8);} .u-imageSpectrum .u-baseColor--placeholderNormal :-ms-input-placeholder {color: rgba(255, 255, 255, 0.8);} .u-imageSpectrum .ui-h1,.u-imageSpectrum .ui-h2,.u-imageSpectrum .ui-h3,.u-imageSpectrum .ui-h4,.u-imageSpectrum .ui-brand1,.u-imageSpectrum .ui-brand2,.u-imageSpectrum .ui-captionStrong {color: rgba(255, 255, 255, 1) !important; fill: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .ui-body,.u-imageSpectrum .ui-caps {color: rgba(255, 255, 255, 1) !important; fill: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .ui-summary,.u-imageSpectrum .ui-caption {color: rgba(255, 255, 255, 0.8) !important; fill: rgba(255, 255, 255, 0.8) !important;} .u-imageSpectrum .u-accentColor--borderLight {border-color: rgba(255, 255, 255, 0.6980392156862745) !important;} .u-imageSpectrum .u-accentColor--borderNormal {border-color: rgba(255, 255, 255, 0.8980392156862745) !important;} .u-imageSpectrum .u-accentColor--borderDark {border-color: rgba(255, 255, 255, 0.9490196078431372) !important;} .u-imageSpectrum .u-accentColor--iconLight .svgIcon,.u-imageSpectrum .u-accentColor--iconLight.svgIcon {fill: rgba(255, 255, 255, 0.8) !important;} .u-imageSpectrum .u-accentColor--iconNormal .svgIcon,.u-imageSpectrum .u-accentColor--iconNormal.svgIcon {fill: rgba(255, 255, 255, 0.9490196078431372) !important;} .u-imageSpectrum .u-accentColor--iconDark .svgIcon,.u-imageSpectrum .u-accentColor--iconDark.svgIcon {fill: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .u-accentColor--textNormal {color: rgba(255, 255, 255, 0.9490196078431372) !important;} .u-imageSpectrum .u-accentColor--hoverTextNormal:hover {color: rgba(255, 255, 255, 0.9490196078431372) !important;} .u-imageSpectrum .u-accentColor--textNormal.u-accentColor--textDarken:hover {color: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .u-accentColor--textDark {color: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .u-accentColor--backgroundLight {background-color: rgba(255, 255, 255, 0.8980392156862745) !important;} .u-imageSpectrum .u-accentColor--backgroundNormal {background-color: rgba(255, 255, 255, 0.9490196078431372) !important;} .u-imageSpectrum .u-accentColor--backgroundDark {background-color: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .u-accentColor--buttonDark {border-color: rgba(255, 255, 255, 0.9490196078431372) !important; color: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .u-accentColor--buttonDark:hover {border-color: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .u-accentColor--buttonDark .icon:before,.u-imageSpectrum .u-accentColor--buttonDark .svgIcon{color: rgba(255, 255, 255, 1) !important; fill: rgba(255, 255, 255, 1) !important;} .u-imageSpectrum .u-accentColor--buttonNormal:not(.clapButton--largePill) {border-color: rgba(255, 255, 255, 0.8980392156862745) !important; color: rgba(255, 255, 255, 0.9490196078431372) !important;} .u-imageSpectrum .u-accentColor--buttonNormal:hover {border-color: rgba(255, 255, 255, 0.9490196078431372) !important;} .u-imageSpectrum .u-accentColor--buttonNormal .icon:before,.u-imageSpectrum .u-accentColor--buttonNormal .svgIcon{color: rgba(255, 255, 255, 0.9490196078431372) !important; fill: rgba(255, 255, 255, 0.9490196078431372) !important;} .u-imageSpectrum .u-accentColor--buttonNormal.button--filled .icon:before,.u-imageSpectrum .u-accentColor--buttonNormal.button--filled .svgIcon{color: rgba(0, 0, 0, 0.24705882352941178) !important; fill: rgba(0, 0, 0, 0.24705882352941178) !important;} .u-imageSpectrum .u-accentColor--buttonDark.button--filled,.u-imageSpectrum .u-accentColor--buttonDark.button--withChrome.is-active,.u-imageSpectrum .u-accentColor--fillWhenActive.is-active {background-color: rgba(255, 255, 255, 1) !important; border-color: rgba(255, 255, 255, 1) !important; color: rgba(0, 0, 0, 0.24705882352941178) !important; fill: rgba(0, 0, 0, 0.24705882352941178) !important;} .u-imageSpectrum .u-accentColor--buttonNormal.button--filled:not(.clapButton--largePill),.u-imageSpectrum .u-accentColor--buttonNormal.button--withChrome.is-active:not(.clapButton--largePill) {background-color: rgba(255, 255, 255, 0.9490196078431372) !important; border-color: rgba(255, 255, 255, 0.9490196078431372) !important; color: rgba(0, 0, 0, 0.24705882352941178) !important; fill: rgba(0, 0, 0, 0.24705882352941178) !important;} .u-imageSpectrum .postArticle.is-withAccentColors .markup--user,.u-imageSpectrum .postArticle.is-withAccentColors .markup--query {color: rgba(255, 255, 255, 0.9490196078431372) !important;} .u-imageSpectrum .u-accentColor--highlightFaint {background-color: rgba(255, 255, 255, 0.2) !important;} .u-imageSpectrum .u-accentColor--highlightStrong.is-active .svgIcon {fill: rgba(255, 255, 255, 0.6) !important;} .postArticle.is-withAccentColors .u-imageSpectrum .markup--quote.is-other {background-color: rgba(255, 255, 255, 0.2) !important;} body.is-withMagicUnderlines .postArticle.is-withAccentColors .u-imageSpectrum .markup--quote.is-other {background-color: transparent !important; background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2));} .postArticle.is-withAccentColors .u-imageSpectrum .markup--quote.is-me {background-color: rgba(255, 255, 255, 0.4) !important;} body.is-withMagicUnderlines .postArticle.is-withAccentColors .u-imageSpectrum .markup--quote.is-me {background-color: transparent !important; background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.4));} .postArticle.is-withAccentColors .u-imageSpectrum .markup--quote.is-targeted {background-color: rgba(255, 255, 255, 0.6) !important;} body.is-withMagicUnderlines .postArticle.is-withAccentColors .u-imageSpectrum .markup--quote.is-targeted {background-color: transparent !important; background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));} .postArticle.is-withAccentColors .u-imageSpectrum .markup--quote.is-selected {background-color: rgba(255, 255, 255, 0.6) !important;} body.is-withMagicUnderlines .postArticle.is-withAccentColors .u-imageSpectrum .markup--quote.is-selected {background-color: transparent !important; background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));} .postArticle.is-withAccentColors .u-imageSpectrum .markup--highlight {background-color: rgba(255, 255, 255, 0.6) !important;} body.is-withMagicUnderlines .postArticle.is-withAccentColors .u-imageSpectrum .markup--highlight {background-color: transparent !important; background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));}.u-resetSpectrum .u-tintBgColor {background-color: rgba(255, 255, 255, 1) !important;}.u-resetSpectrum .u-tintBgColor .u-fadeLeft:before {background-image: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%) !important;}.u-resetSpectrum .u-tintBgColor .u-fadeRight:after {background-image: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%) !important;} .u-resetSpectrum .u-baseColor--borderLight {border-color: rgba(0, 0, 0, 0.2980392156862745) !important;} .u-resetSpectrum .u-baseColor--borderNormal {border-color: rgba(0, 0, 0, 0.4980392156862745) !important;} .u-resetSpectrum .u-baseColor--borderDark {border-color: rgba(0, 0, 0, 0.6) !important;} .u-resetSpectrum .u-baseColor--iconLight .svgIcon,.u-resetSpectrum .u-baseColor--iconLight.svgIcon {fill: rgba(0, 0, 0, 0.2980392156862745) !important;} .u-resetSpectrum .u-baseColor--iconNormal .svgIcon,.u-resetSpectrum .u-baseColor--iconNormal.svgIcon {fill: rgba(0, 0, 0, 0.4980392156862745) !important;} .u-resetSpectrum .u-baseColor--iconDark .svgIcon,.u-resetSpectrum .u-baseColor--iconDark.svgIcon {fill: rgba(0, 0, 0, 0.6) !important;} .u-resetSpectrum .u-baseColor--textNormal {color: rgba(0, 0, 0, 0.4980392156862745) !important;} .u-resetSpectrum .u-baseColor--textNormal.u-baseColor--textDarken:hover {color: rgba(0, 0, 0, 0.6) !important;} .u-resetSpectrum .u-baseColor--textDark {color: rgba(0, 0, 0, 0.6) !important;} .u-resetSpectrum .u-baseColor--textDarker {color: rgba(0, 0, 0, 0.8) !important;} .u-resetSpectrum .u-baseColor--backgroundLight {background-color: rgba(0, 0, 0, 0.09803921568627451) !important;} .u-resetSpectrum .u-baseColor--backgroundNormal {background-color: rgba(0, 0, 0, 0.2) !important;} .u-resetSpectrum .u-baseColor--backgroundDark {background-color: rgba(0, 0, 0, 0.2980392156862745) !important;} .u-resetSpectrum .u-baseColor--buttonLight {border-color: rgba(0, 0, 0, 0.2980392156862745) !important; color: rgba(0, 0, 0, 0.2980392156862745) !important;} .u-resetSpectrum .u-baseColor--buttonLight:hover {border-color: rgba(0, 0, 0, 0.2980392156862745) !important;} .u-resetSpectrum .u-baseColor--buttonLight .icon:before,.u-resetSpectrum .u-baseColor--buttonLight .svgIcon {color: rgba(0, 0, 0, 0.2980392156862745) !important; fill: rgba(0, 0, 0, 0.2980392156862745) !important;} .u-resetSpectrum .u-baseColor--buttonDark {border-color: rgba(0, 0, 0, 0.6) !important; color: rgba(0, 0, 0, 0.6) !important;} .u-resetSpectrum .u-baseColor--buttonDark:hover {border-color: rgba(0, 0, 0, 0.8) !important;} .u-resetSpectrum .u-baseColor--buttonDark .icon:before,.u-resetSpectrum .u-baseColor--buttonDark .svgIcon {color: rgba(0, 0, 0, 0.6) !important; fill: rgba(0, 0, 0, 0.6) !important;} .u-resetSpectrum .u-baseColor--buttonNormal {border-color: rgba(0, 0, 0, 0.4980392156862745) !important; color: rgba(0, 0, 0, 0.4980392156862745) !important;} .u-resetSpectrum .u-baseColor--buttonNormal:hover {border-color: rgba(0, 0, 0, 0.6) !important;} .u-resetSpectrum .u-baseColor--buttonNormal .icon:before,.u-resetSpectrum .u-baseColor--buttonNormal .svgIcon {color: rgba(0, 0, 0, 0.4980392156862745) !important; fill: rgba(0, 0, 0, 0.4980392156862745) !important;} .u-resetSpectrum .u-baseColor--buttonDark.button--filled,.u-resetSpectrum .u-baseColor--buttonDark.button--withChrome.is-active {background-color: rgba(0, 0, 0, 0.2980392156862745) !important; border-color: rgba(0, 0, 0, 0.2980392156862745) !important; color: rgba(255, 255, 255, 1) !important; fill: rgba(255, 255, 255, 1) !important;} .u-resetSpectrum .u-baseColor--buttonNormal.button--filled,.u-resetSpectrum .u-baseColor--buttonNormal.button--withChrome.is-active {background-color: rgba(0, 0, 0, 0.2) !important; border-color: rgba(0, 0, 0, 0.2) !important; color: rgba(255, 255, 255, 1) !important; fill: rgba(255, 255, 255, 1) !important;} .u-resetSpectrum .u-baseColor--link {color: rgba(0, 0, 0, 0.4980392156862745) !important;} .u-resetSpectrum .u-baseColor--link.link--darkenOnHover:hover {color: rgba(0, 0, 0, 0.6) !important;} .u-resetSpectrum .u-baseColor--link.link--darken:hover,.u-resetSpectrum .u-baseColor--link.link--darken:focus,.u-resetSpectrum .u-baseColor--link.link--darken:active {color: rgba(0, 0, 0, 0.6) !important;} .u-resetSpectrum .u-baseColor--link.link--dark {color: rgba(0, 0, 0, 0.6) !important;} .u-resetSpectrum .u-baseColor--link.link--dark.link--darken:hover,.u-resetSpectrum .u-baseColor--link.link--dark.link--darken:focus,.u-resetSpectrum .u-baseColor--link.link--dark.link--darken:active {color: rgba(0, 0, 0, 0.8) !important;} .u-resetSpectrum .u-baseColor--link.link--darker {color: rgba(0, 0, 0, 0.8) !important;} .u-resetSpectrum .u-baseColor--placeholderNormal ::-webkit-input-placeholder {color: rgba(0, 0, 0, 0.2980392156862745);} .u-resetSpectrum .u-baseColor--placeholderNormal ::-moz-placeholder {color: rgba(0, 0, 0, 0.2980392156862745);} .u-resetSpectrum .u-baseColor--placeholderNormal :-ms-input-placeholder {color: rgba(0, 0, 0, 0.2980392156862745);} .u-resetSpectrum .ui-h1,.u-resetSpectrum .ui-h2,.u-resetSpectrum .ui-h3,.u-resetSpectrum .ui-h4,.u-resetSpectrum .ui-brand1,.u-resetSpectrum .ui-brand2,.u-resetSpectrum .ui-captionStrong {color: rgba(0, 0, 0, 0.8) !important; fill: rgba(0, 0, 0, 0.8) !important;} .u-resetSpectrum .ui-body,.u-resetSpectrum .ui-caps {color: rgba(0, 0, 0, 0.6) !important; fill: rgba(0, 0, 0, 0.6) !important;} .u-resetSpectrum .ui-summary,.u-resetSpectrum .ui-caption {color: rgba(0, 0, 0, 0.2980392156862745) !important; fill: rgba(0, 0, 0, 0.2980392156862745) !important;} .u-resetSpectrum .u-accentColor--borderLight {border-color: rgba(26, 137, 23, 1) !important;} .u-resetSpectrum .u-accentColor--borderNormal {border-color: rgba(26, 137, 23, 1) !important;} .u-resetSpectrum .u-accentColor--borderDark {border-color: rgba(17, 128, 14, 1) !important;} .u-resetSpectrum .u-accentColor--iconLight .svgIcon,.u-resetSpectrum .u-accentColor--iconLight.svgIcon {fill: rgba(26, 137, 23, 1) !important;} .u-resetSpectrum .u-accentColor--iconNormal .svgIcon,.u-resetSpectrum .u-accentColor--iconNormal.svgIcon {fill: rgba(17, 128, 14, 1) !important;} .u-resetSpectrum .u-accentColor--iconDark .svgIcon,.u-resetSpectrum .u-accentColor--iconDark.svgIcon {fill: rgba(15, 115, 12, 1) !important;} .u-resetSpectrum .u-accentColor--textNormal {color: rgba(17, 128, 14, 1) !important;} .u-resetSpectrum .u-accentColor--hoverTextNormal:hover {color: rgba(17, 128, 14, 1) !important;} .u-resetSpectrum .u-accentColor--textNormal.u-accentColor--textDarken:hover {color: rgba(15, 115, 12, 1) !important;} .u-resetSpectrum .u-accentColor--textDark {color: rgba(15, 115, 12, 1) !important;} .u-resetSpectrum .u-accentColor--backgroundLight {background-color: rgba(26, 137, 23, 1) !important;} .u-resetSpectrum .u-accentColor--backgroundNormal {background-color: rgba(17, 128, 14, 1) !important;} .u-resetSpectrum .u-accentColor--backgroundDark {background-color: rgba(15, 115, 12, 1) !important;} .u-resetSpectrum .u-accentColor--buttonDark {border-color: rgba(17, 128, 14, 1) !important; color: rgba(15, 115, 12, 1) !important;} .u-resetSpectrum .u-accentColor--buttonDark:hover {border-color: rgba(15, 115, 12, 1) !important;} .u-resetSpectrum .u-accentColor--buttonDark .icon:before,.u-resetSpectrum .u-accentColor--buttonDark .svgIcon{color: rgba(15, 115, 12, 1) !important; fill: rgba(15, 115, 12, 1) !important;} .u-resetSpectrum .u-accentColor--buttonNormal:not(.clapButton--largePill) {border-color: rgba(26, 137, 23, 1) !important; color: rgba(17, 128, 14, 1) !important;} .u-resetSpectrum .u-accentColor--buttonNormal:hover {border-color: rgba(17, 128, 14, 1) !important;} .u-resetSpectrum .u-accentColor--buttonNormal .icon:before,.u-resetSpectrum .u-accentColor--buttonNormal .svgIcon{color: rgba(17, 128, 14, 1) !important; fill: rgba(17, 128, 14, 1) !important;} .u-resetSpectrum .u-accentColor--buttonNormal.button--filled .icon:before,.u-resetSpectrum .u-accentColor--buttonNormal.button--filled .svgIcon{color: rgba(255, 255, 255, 1) !important; fill: rgba(255, 255, 255, 1) !important;} .u-resetSpectrum .u-accentColor--buttonDark.button--filled,.u-resetSpectrum .u-accentColor--buttonDark.button--withChrome.is-active,.u-resetSpectrum .u-accentColor--fillWhenActive.is-active {background-color: rgba(15, 115, 12, 1) !important; border-color: rgba(15, 115, 12, 1) !important; color: rgba(255, 255, 255, 1) !important; fill: rgba(255, 255, 255, 1) !important;} .u-resetSpectrum .u-accentColor--buttonNormal.button--filled:not(.clapButton--largePill),.u-resetSpectrum .u-accentColor--buttonNormal.button--withChrome.is-active:not(.clapButton--largePill) {background-color: rgba(17, 128, 14, 1) !important; border-color: rgba(17, 128, 14, 1) !important; color: rgba(255, 255, 255, 1) !important; fill: rgba(255, 255, 255, 1) !important;} .u-resetSpectrum .postArticle.is-withAccentColors .markup--user,.u-resetSpectrum .postArticle.is-withAccentColors .markup--query {color: rgba(17, 128, 14, 1) !important;}</style></div></div></div><div class="loadingBar"></div><script>// <![CDATA[ window["obvInit"] = function (opt_embedded) {window["obvInit"]["embedded"] = opt_embedded; window["obvInit"]["ready"] = true;} // ]]></script><script>// <![CDATA[ var GLOBALS = {"audioUrl":"https://d1fcbxp97j4nb2.cloudfront.net","baseUrl":"https://medium.com","buildLabel":"20241202-1823-root","currentUser":{"userId":"lo_a41a4418babe","isVerified":false,"subscriberEmail":"","hasPastMemberships":false,"isEnrolledInHightower":false,"isEligibleForHightower":true,"hightowerLastLockedAt":0,"isWriterProgramEnrolled":true,"isWriterProgramInvited":false,"isWriterProgramOptedOut":false,"writerProgramVersion":0,"writerProgramEnrolledAt":0,"friendLinkOnboarding":0,"hasAdditionalUnlocks":false,"hasApiAccess":false,"writerProgramDistributionSettingOptedIn":false,"isSuspended":false,"collectionOnboardingSeen":0,"atsQualifiedAt":0},"currentUserHasUnverifiedEmail":false,"isAuthenticated":false,"isCurrentUserVerified":false,"miroUrl":"https://cdn-images-1.medium.com","moduleUrls":{"base":"https://cdn-static-1.medium.com/_/fp/gen-js/main-base.bundle.8hTd_XFOikoOV0kJZIN5Nw.12.js","common-async":"https://cdn-static-1.medium.com/_/fp/gen-js/main-common-async.bundle.Qy6ah4f91w20jfu666BAnA.12.js","hightower":"https://cdn-static-1.medium.com/_/fp/gen-js/main-hightower.bundle.y0UkxCxPBUbLlduk5XbwLQ.12.js","home-screens":"https://cdn-static-1.medium.com/_/fp/gen-js/main-home-screens.bundle.eZhPgaD8AglnbC5Rzxqvhg.12.js","misc-screens":"https://cdn-static-1.medium.com/_/fp/gen-js/main-misc-screens.bundle._3sFgeS2d1AoQzYKqNXeTA.12.js","notes":"https://cdn-static-1.medium.com/_/fp/gen-js/main-notes.bundle.SAMCbq1ffJ6HMzwniRoo9g.12.js","payments":"https://cdn-static-1.medium.com/_/fp/gen-js/main-payments.bundle.AiXyuYj3AvxRA1-7HEyP9Q.12.js","posters":"https://cdn-static-1.medium.com/_/fp/gen-js/main-posters.bundle.4zVUlXp2nm6KJVeUDNORVg.12.js","power-readers":"https://cdn-static-1.medium.com/_/fp/gen-js/main-power-readers.bundle.6Dyc-nVN2MDV_AM9XDAZug.12.js","pubs":"https://cdn-static-1.medium.com/_/fp/gen-js/main-pubs.bundle.zmDFkcqRGpKmOcLmQ7vS6A.12.js","stats":"https://cdn-static-1.medium.com/_/fp/gen-js/main-stats.bundle.2I2tXSo7-rbez_WYXfga0Q.12.js"},"previewConfig":{"weightThreshold":1,"weightImageParagraph":0.51,"weightIframeParagraph":0.8,"weightTextParagraph":0.08,"weightEmptyParagraph":0,"weightP":0.003,"weightH":0.005,"weightBq":0.003,"minPTextLength":60,"truncateBoundaryChars":20,"detectTitle":true,"detectTitleLevThreshold":0.15},"productName":"Medium","supportsEdit":false,"termsUrl":"//policy.medium.com/medium-terms-of-service-9db0094a1e0f","textshotHost":"textshot.textshot-production.svc.cluster.local","transactionId":"1733168082388:f9c93728c48a","useragent":{"browser":"ie","family":"ie","os":"windows","version":7,"supportsDesktopEdit":false,"supportsInteract":false,"supportsView":true,"isMobile":false,"isTablet":false,"isNative":false,"supportsFileAPI":false,"isTier1":false,"clientVersion":"","clientChannel":"","supportsRealScrollEvents":false,"supportsVhUnits":false,"ruinsViewportSections":false,"supportsHtml5Video":false,"supportsMagicUnderlines":false,"isWebView":false,"isFacebookWebView":false,"supportsProgressiveMedia":false,"supportsPromotedPosts":true,"isBot":false,"isNativeIphone":false,"supportsCssVariables":false,"supportsVideoSections":true,"emojiSupportLevel":1,"isSearchBot":false,"isSyndicationBot":false,"isNativeAndroid":false,"isNativeIos":false,"isSeoAuditBot":false,"isInternalApp":false,"supportsApplePay":false,"supportsScrollableMetabar":false},"variants":{"allow_access":true,"allow_signup":true,"allow_test_auth":"disallow","android_enable_editor_new_publishing_flow":true,"android_enable_friend_links_creation":true,"android_enable_friend_links_postpage_banners":true,"android_enable_image_sharer":true,"android_enable_lists_v2":true,"android_enable_syntax_highlight":true,"android_enable_topic_portals":true,"android_rating_prompt_stories_read_threshold":2,"android_two_hour_refresh":true,"available_annual_plan":"2c754bcc2995","available_annual_premium_plan":"4a442ace1476","available_monthly_plan":"60e220181034","available_monthly_premium_plan":"12a660186432","browsable_stream_config_bucket":"curated-topics","can_receive_tips_v0":true,"can_send_tips_v0":true,"coronavirus_topic_recirc":true,"disable_partner_program_enrollment":true,"enable_abandoned_cart_promotion_email":true,"enable_android_dynamic_aspirational_paywall":true,"enable_android_dynamic_programming_paywall":true,"enable_android_miro_v2":true,"enable_android_offline_reading":true,"enable_android_verified_author":true,"enable_app_flirty_thirty":true,"enable_apple_sign_in":true,"enable_apple_webhook":true,"enable_aurora_pub_follower_page":true,"enable_author_cards":true,"enable_author_cards_byline":true,"enable_auto_follow_on_subscribe":true,"enable_automod":true,"enable_bayesian_average_pub_search":true,"enable_bg_post_post":true,"enable_boost_nia_v01":true,"enable_braintree_apple_pay":true,"enable_braintree_client":true,"enable_braintree_google_pay":true,"enable_braintree_integration":true,"enable_braintree_paypal":true,"enable_braintree_trial_membership":true,"enable_braintree_webhook":true,"enable_branch_io":true,"enable_cache_less_following_feed":true,"enable_configure_pronouns":true,"enable_conversion_model_v2":"group_2","enable_conversion_ranker_v2":"control","enable_creator_welcome_email":true,"enable_deprecate_legacy_providers_v3":true,"enable_diversification_rex":true,"enable_entities_to_follow_v2":true,"enable_eventstats_event_processing":true,"enable_explicit_signals":true,"enable_explicit_signals_updated_post_previews":true,"enable_footer_app_buttons":true,"enable_google_one_tap":true,"enable_google_webhook":true,"enable_group_gifting":true,"enable_iceland_forced_android":true,"enable_import":true,"enable_intrinsic_automatic_actions":true,"enable_ios_autorefresh":true,"enable_ios_dynamic_paywall_aspiriational":true,"enable_ios_dynamic_paywall_programming":true,"enable_ios_easy_resubscribe":true,"enable_ios_offline_reading":true,"enable_legacy_feed_in_iceland":true,"enable_lite_archive_page":true,"enable_lite_continue_this_thread":true,"enable_lite_homepage":true,"enable_lite_response_markup":true,"enable_lite_server_upstream_deadlines":true,"enable_lo_homepage":"control","enable_maim_the_meter":true,"enable_marketing_emails":true,"enable_mastodon_avatar_upload":true,"enable_mastodon_for_members":true,"enable_mastodon_for_members_username_selection":true,"enable_medium2_kbfd":true,"enable_members_only_audio":true,"enable_ml_rank_rex_anno":true,"enable_moc_load_processor_all_recs_surfaces":true,"enable_moc_load_processor_c":true,"enable_moc_load_processor_first_story":true,"enable_new_manage_membership_flow":true,"enable_new_stripe_customers":true,"enable_newsletter_lo_flow_custom_domains":true,"enable_pill_based_home_feed":true,"enable_post_bottom_responses":true,"enable_post_bottom_responses_input":true,"enable_pp_country_expansion":true,"enable_pp_v4":true,"enable_pre_pp_v4":true,"enable_premium_tier":true,"enable_premium_tier_badge":true,"enable_publication_hierarchy_web":true,"enable_ranker_v10":"control","enable_recaptcha_enterprise":true,"enable_recirc_model":true,"enable_recommended_publishers_query":true,"enable_rex_aggregator_v2":true,"enable_rex_new_push_notification_endpoint":true,"enable_rex_reading_history":true,"enable_rito_upstream_deadlines":true,"enable_seamless_social_sharing":true,"enable_see_pronouns":true,"enable_sharer_create_post_share_key":true,"enable_sharer_validate_post_share_key":true,"enable_simplified_digest_v2_b":true,"enable_speechify_ios":true,"enable_speechify_widget":true,"enable_sprig":true,"enable_starspace":true,"enable_susi_redesign_android":true,"enable_susi_redesign_ios":true,"enable_switch_plan_premium_tier":true,"enable_tag_recs":true,"enable_tick_landing_page":true,"enable_tipping_v0_android":true,"enable_tipping_v0_ios":true,"enable_tribute_landing_page":true,"enable_update_explore_wtf":true,"enable_update_topic_portals_wtf":true,"enable_updated_pub_recs_ui":true,"enable_verifications_service":true,"glyph_font_set":"m2-unbound-source-serif-pro","goliath_externalsearch_enable_comment_deindexation":true,"ios_display_paywall_after_onboarding":true,"ios_enable_friend_links_creation":true,"ios_enable_friend_links_postpage_banners":true,"ios_enable_home_post_menu":true,"ios_enable_lock_responses":true,"ios_enable_verified_book_author":true,"ios_iceland_nux":true,"ios_in_app_free_trial":true,"ios_remove_twitter_onboarding_step":true,"ios_social_share_sheet":true,"limit_post_referrers":true,"limit_user_follows":true,"mobile_custom_app_icon":true,"num_post_bottom_responses_to_show":"3","onboarding_tags_from_top_views":true,"reader_fair_distribution_non_qp":true,"redefined_top_posts":true,"reengagement_notification_duration":3,"rex_generator_max_candidates":1000,"signin_services":"twitter,facebook,google,email,google-fastidv,google-one-tap,apple","signup_services":"twitter,facebook,google,email,google-fastidv,google-one-tap,apple","skip_fs_cache_user_vals":true},"xsrfToken":"","iosAppId":"828256236","supportEmail":"yourfriends@medium.com","fp":{"/icons/monogram-mask.svg":"https://cdn-static-1.medium.com/_/fp/icons/monogram-mask.KPLCSFEZviQN0jQ7veN2RQ.12.svg","/icons/favicon-medium-editor.ico":"https://cdn-static-1.medium.com/_/fp/icons/favicon-medium-editor.PiakrZWB7Yb80quUVQWM6g.12.ico"},"authBaseUrl":"https://medium.com","imageUploadSizeMb":25,"isAuthDomainRequest":true,"algoliaApiEndpoint":"https://MQ57UUUQZ2-dsn.algolia.net","algoliaAppId":"MQ57UUUQZ2","algoliaSearchOnlyApiKey":"394474ced050e3911ae2249ecc774921","iosAppStoreUrl":"https://itunes.apple.com/app/medium-everyones-stories/id828256236?pt=698524&mt=8","iosAppLinkBaseUrl":"medium:","algoliaIndexPrefix":"medium_","androidPlayStoreUrl":"https://play.google.com/store/apps/details?id=com.medium.reader","googleClientId":"216296035834-k1k6qe060s2tp2a2jam4ljdcms00sttg.apps.googleusercontent.com","androidPackage":"com.medium.reader","androidPlayStoreMarketScheme":"market://details?id=com.medium.reader","googleAuthUri":"https://accounts.google.com/o/oauth2/auth","androidScheme":"medium","layoutData":{"useDynamicScripts":false,"googleAnalyticsTrackingCode":"G-7JY7T788PK","jsShivUrl":"https://cdn-static-1.medium.com/_/fp/js/shiv.RI2ePTZ5gFmMgLzG5bEVAA.12.js","useDynamicCss":false,"faviconUrl":"https://miro.medium.com/v2/5d8de952517e8160e40ef9841c781cdc14a5db313057fa3c3de41c6f5b494b19","faviconImageId":"5d8de952517e8160e40ef9841c781cdc14a5db313057fa3c3de41c6f5b494b19","fontSets":[{"id":8,"url":"https://glyph.medium.com/css/e/sr/latin/e/ssr/latin/e/ssb/latin/m2-unbound-source-serif-pro.css"},{"id":11,"url":"https://glyph.medium.com/css/m2-unbound-source-serif-pro.css"},{"id":9,"url":"https://glyph.medium.com/css/mkt.css"}],"glyphUrl":"https://glyph.medium.com"},"authBaseUrlRev":"moc.muidem//:sptth","stripePublishableKey":"pk_live_7FReX44VnNIInZwrIIx6ghjl","archiveUploadSizeMb":100,"previewConfig2":{"weightThreshold":1,"weightImageParagraph":0.05,"raiseImage":true,"enforceHeaderHierarchy":true,"isImageInsetRight":true},"isAmp":false,"iosScheme":"medium","facebook":{"key":"542599432471018","namespace":"medium-com","scope":{"default":["public_profile","email"],"connect":["public_profile","email"],"login":["public_profile","email"],"share":["public_profile","email"]}},"memberContentTopicId":"13d7efd82fb2","audioContentTopicId":"3792abbd134","isDoNotAuth":false,"buggle":{"videoUrl":"https://cdn-videos-1.medium.com","audioUrl":"https://cdn-audio-1.medium.com"},"referrerType":5,"partnerProgramEmail":"partnerprogram@medium.com","recaptchaKey":"6Lfc37IUAAAAAKGGtC6rLS13R1Hrw_BqADfS1LRk","countryCode":"SG","bypassMeter":false,"branchKey":"key_live_ofxXr2qTrrU9NqURK8ZwEhknBxiI6KBm","paypal":{"clientMode":"production","oneYearGift":{"name":"Medium Membership (1 Year, Digital Gift Code)","description":"Unlimited access to the best and brightest stories on Medium. Gift codes can be redeemed at medium.com/redeem.","price":"50.00","currency":"USD","sku":"membership-gift-1-yr"}},"collectionConfig":{"mediumOwnedAndOperatedCollectionIds":["8a9336e5bb4","b7e45b22fec3","193b68bd4fba","8d6b8a439e32","54c98c43354d","3f6ecf56618","d944778ce714","92d2092dc598","ae2a65f35510","1285ba81cada","544c7006046e","fc8964313712","40187e704f1c","88d9857e584e","7b6769f2748b","bcc38c8f6edf","cef6983b292","cb8577c9149e","444d13b52878","713d7dbc99b0","ef8e90590e66","191186aaafa0","55760f21cdc5","9dc80918cc93","bdc4052bbdba","8ccfed20cbb2"]},"bypassMeterWithShareKey":false,"recaptcha3Key":"6Lf8R9wUAAAAABMI_85Wb8melS7Zj6ziuf99Yot5","braintreeClientKey":"production_zjkj96jm_m56f8fqpf7ngnrd4","cdcMessaging":[{"text":"For more information on the novel coronavirus and Covid-19, visit ","href":"","type":"text","start":0,"end":0},{"text":"cdc.gov","href":"https://www.cdc.gov/coronavirus/2019-nCoV","type":"link","start":66,"end":73},{"text":".","href":"","type":"text","start":0,"end":0}],"braintree":{"merchantId":"m56f8fqpf7ngnrd4"},"diagnostics":{},"domain":"medium.com"} // ]]></script><script charset="UTF-8" src="https://cdn-static-1.medium.com/_/fp/gen-js/main-base.bundle.8hTd_XFOikoOV0kJZIN5Nw.12.js" async></script><script>// <![CDATA[ window["obvInit"]({"references":{"Collection":{"4da7dfd21a33":{"id":"4da7dfd21a33","name":"Flutter","slug":"flutter","tags":["MOBILE APP DEVELOPMENT","FLUTTER","GOOGLE","IOS APP DEVELOPMENT","ANDROID APP DEVELOPMENT"],"creatorId":"2df4e577749c","description":"Flutter is Google's UI framework for crafting high-quality native interfaces on iOS, Android, web, and desktop. Flutter works with existing code, is used by developers and organizations around the world, and is free and open source. Learn more at https://flutter.dev","shortDescription":"Flutter is Google's UI framework for crafting high-quality…","image":{"imageId":"1*5-aoK8IBmXve5whBQM90GA.png","filter":"","backgroundSize":"","originalWidth":1000,"originalHeight":1000,"strategy":"resample","height":0,"width":0},"metadata":{"followerCount":57048,"activeAt":1732210323729},"virtuals":{"permissions":{"canPublish":false,"canPublishAll":false,"canRepublish":false,"canRemove":false,"canManageAll":false,"canSubmit":false,"canEditPosts":false,"canAddWriters":false,"canViewStats":false,"canSendNewsletter":false,"canViewLockedPosts":false,"canViewCloaked":false,"canEditOwnPosts":false,"canBeAssignedAuthor":false,"canEnrollInHightower":false,"canLockPostsForMediumMembers":false,"canLockOwnPostsForMediumMembers":false,"canViewNewsletterV2Stats":false,"canCreateNewsletterV3":false},"isSubscribed":false,"isEnrolledInHightower":false,"isEligibleForHightower":false,"isSubscribedToCollectionEmails":false,"isMuted":false,"canToggleEmail":false,"isWriter":false},"logo":{"imageId":"1*KvnfbD1F5CzEsU9wSmRZyA.png","filter":"","backgroundSize":"","originalWidth":538,"originalHeight":141,"strategy":"resample","height":0,"width":0},"twitterUsername":"flutterdev","collectionMastheadId":"6f4efe3cee51","sections":[{"type":2,"collectionHeaderMetadata":{"title":"Flutter","description":"Build beautiful native apps in record time","backgroundImage":{},"logoImage":{"id":"1*XrbUBnZb-Vp9jRDGqU-BXQ@2x.png","originalWidth":2000,"originalHeight":2109,"alt":"Flutter"},"alignment":2,"layout":5}},{"type":1,"postListMetadata":{"source":3,"layout":4,"number":1,"postIds":["204b7d20c45d"]}},{"type":1,"postListMetadata":{"source":1,"layout":4,"number":9,"postIds":[]}},{"type":1,"postListMetadata":{"source":1,"layout":5,"number":15,"postIds":[]}}],"tintColor":"#FF01579B","lightText":true,"favicon":{"imageId":"","filter":"","backgroundSize":"","originalWidth":0,"originalHeight":0,"strategy":"resample","height":0,"width":0},"colorPalette":{"defaultBackgroundSpectrum":{"colorPoints":[{"color":"#FF498BD1","point":0},{"color":"#FF4781C0","point":0.1},{"color":"#FF4477AF","point":0.2},{"color":"#FF416D9E","point":0.3},{"color":"#FF3D638D","point":0.4},{"color":"#FF38587C","point":0.5},{"color":"#FF324D6B","point":0.6},{"color":"#FF2C415A","point":0.7},{"color":"#FF253548","point":0.8},{"color":"#FF1C2937","point":0.9},{"color":"#FF121B25","point":1}],"backgroundColor":"#FFFFFFFF"},"tintBackgroundSpectrum":{"colorPoints":[{"color":"#FF01579B","point":0},{"color":"#FF306CA9","point":0.1},{"color":"#FF4D7FB7","point":0.2},{"color":"#FF6591C4","point":0.3},{"color":"#FF7CA3D0","point":0.4},{"color":"#FF92B4DC","point":0.5},{"color":"#FFA7C4E7","point":0.6},{"color":"#FFBCD3F1","point":0.7},{"color":"#FFD0E3FC","point":0.8},{"color":"#FFE3F2FF","point":0.9},{"color":"#FFF7FFFF","point":1}],"backgroundColor":"#FF01579B"},"highlightSpectrum":{"colorPoints":[{"color":"#FFE8F5FF","point":0},{"color":"#FFE3F3FF","point":0.1},{"color":"#FFDEF2FF","point":0.2},{"color":"#FFDAF0FF","point":0.3},{"color":"#FFD5EFFF","point":0.4},{"color":"#FFD0EDFF","point":0.5},{"color":"#FFCBECFF","point":0.6},{"color":"#FFC6EBFF","point":0.7},{"color":"#FFC1E9FF","point":0.8},{"color":"#FFBCE8FF","point":0.9},{"color":"#FFB6E6FF","point":1}],"backgroundColor":"#FFFFFFFF"},"darkBackgroundSpectrum":{"colorPoints":[{"color":"#FF63A4EB","point":0},{"color":"#FF72ACED","point":0.1},{"color":"#FF81B4EF","point":0.2},{"color":"#FF8FBCF1","point":0.3},{"color":"#FF9CC4F3","point":0.4},{"color":"#FFA9CBF5","point":0.5},{"color":"#FFB6D3F6","point":0.6},{"color":"#FFC2DAF8","point":0.7},{"color":"#FFCFE2FA","point":0.8},{"color":"#FFDAE9FC","point":0.9},{"color":"#FFE6F0FE","point":1}],"backgroundColor":"#FF000000"}},"navItems":[{"type":1,"title":"Announcements","tagSlug":"announcements","url":"https://medium.com/flutter/tagged/announcements","source":"tagSlug"},{"type":1,"title":"Performance","tagSlug":"performance","url":"https://medium.com/flutter/tagged/performance","source":"tagSlug"},{"type":1,"title":"Material Design","tagSlug":"material-design","url":"https://medium.com/flutter/tagged/material-design","source":"tagSlug"},{"type":1,"title":"Web Development","tagSlug":"web-development","url":"https://medium.com/flutter/tagged/web-development","source":"tagSlug"},{"type":3,"title":"flutter.dev","url":"https://flutter.dev/"}],"colorBehavior":2,"collectionFeatures":[25],"ampLogo":{"imageId":"","filter":"","backgroundSize":"","originalWidth":0,"originalHeight":0,"strategy":"resample","height":0,"width":0},"header":{"title":"Flutter","description":"Build beautiful native apps in record time","backgroundImage":{},"logoImage":{"id":"1*XrbUBnZb-Vp9jRDGqU-BXQ@2x.png","originalWidth":2000,"originalHeight":2109,"alt":"Flutter"},"alignment":2,"layout":5},"subscriberCount":57048,"tagline":"Flutter is an open source UI framework for crafting beautiful apps","isOptedIntoAurora":false,"isCurationAllowedByDefault":false,"polarisCoverImage":{"imageId":"","filter":"","backgroundSize":"","originalWidth":0,"originalHeight":0,"strategy":"resample","height":0,"width":0},"ptsQualifiedAt":1616092847310,"type":"Collection"}},"User":{"152f70c4da53":{"userId":"152f70c4da53","name":"Eilidh Southren","username":"eilidhsouthren","createdAt":1506030036275,"imageId":"1*X-6ifCWQoKYCZ-uLGdPa4w.png","backgroundImageId":"","bio":"Enterprise Engineer @ FlutterFlow","twitterScreenName":"","allowNotes":1,"mediumMemberAt":0,"isWriterProgramEnrolled":true,"isSuspended":false,"isMembershipTrialEligible":true,"facebookDisplayName":"","optInToIceland":true,"hasCompletedProfile":false,"userDismissableFlags":[29,33],"hasSeenIcelandOnboarding":false,"postSubscribeMembershipUpsellShownAt":0,"languageCode":"en-us","type":"User"},"df52ddf23910":{"userId":"df52ddf23910","name":"André Labonté","username":"andremobilelabonte","createdAt":1593532744983,"imageId":"0*MWQEEWaslbr-PNFW","backgroundImageId":"","bio":"Product Manager — Material Design","allowNotes":1,"mediumMemberAt":0,"isWriterProgramEnrolled":true,"isSuspended":false,"firstOpenedAndroidApp":1681179281817,"isMembershipTrialEligible":true,"optInToIceland":true,"hasCompletedProfile":false,"hasSeenIcelandOnboarding":true,"postSubscribeMembershipUpsellShownAt":0,"languageCode":"en-us","type":"User"},"a8e501ba3326":{"userId":"a8e501ba3326","name":"Jose Alba","username":"josealba199675","createdAt":1581689707994,"imageId":"0*hPHb0U1EVsdSI-ZK","backgroundImageId":"","bio":"Recently graduated from university and now works on maintaining the Flutter Material Library.","twitterScreenName":"","allowNotes":1,"mediumMemberAt":0,"isWriterProgramEnrolled":true,"isSuspended":false,"firstOpenedIosApp":1583186083618,"isMembershipTrialEligible":true,"facebookDisplayName":"","optInToIceland":true,"hasCompletedProfile":false,"isCreatorPartnerProgramEnrolled":true,"userDismissableFlags":[32,12,2,1,9],"hasSeenIcelandOnboarding":true,"postSubscribeMembershipUpsellShownAt":0,"languageCode":"en-us","type":"User"},"4cad326de3d7":{"userId":"4cad326de3d7","name":"Per Classon","username":"perclasson","createdAt":1384734428033,"imageId":"2*d-UpSVU0saEV2On5JBvYaQ.jpeg","backgroundImageId":"","bio":"Software Engineer 👨🏼‍💻","allowNotes":1,"mediumMemberAt":0,"isWriterProgramEnrolled":true,"isSuspended":false,"firstOpenedIosApp":1585587432311,"isMembershipTrialEligible":true,"optInToIceland":true,"subdomainCreatedAt":1607700516534,"hasCompletedProfile":false,"userDismissableFlags":[8,29,3,2,1],"hasSeenIcelandOnboarding":true,"postSubscribeMembershipUpsellShownAt":0,"languageCode":"en-se","type":"User"},"40a15fe2c58f":{"userId":"40a15fe2c58f","name":"Anthony Robledo","username":"clocksmith","createdAt":1457993139268,"imageId":"1*fcJn7cFYnwInCzoug_PoDA.jpeg","backgroundImageId":"","bio":"4 * (1 - 1/3 + 1/5 - 1/7 + 1/9 -1/11 + 1/13 - 1/15 + 1/17 - 1/19 + 1/21 - 1/23 + 1/25 - 1/27 + 1/29 - 1/31 + 1/33 - 1/35 + 1/37 - 1/39 + 1/41 -1/43 + ... )","twitterScreenName":"","allowNotes":1,"mediumMemberAt":0,"isWriterProgramEnrolled":true,"isSuspended":false,"firstOpenedAndroidApp":1629754569595,"isMembershipTrialEligible":true,"facebookDisplayName":"","optInToIceland":true,"hasCompletedProfile":true,"userDismissableFlags":[32,48,29,8,50,5,3,2,1,33],"hasSeenIcelandOnboarding":true,"postSubscribeMembershipUpsellShownAt":0,"languageCode":"en-us","type":"User"},"a6d788faa5e5":{"userId":"a6d788faa5e5","name":"Michael Thomsen","username":"mit.mit","createdAt":1481367237471,"imageId":"0*Y_CFLc1qadgr3tPK.","backgroundImageId":"","bio":"Product Manager working on Dart and Flutter. Helping developers is my passion!","twitterScreenName":"","allowNotes":1,"mediumMemberAt":0,"isWriterProgramEnrolled":true,"isSuspended":false,"isMembershipTrialEligible":true,"facebookDisplayName":"","optInToIceland":true,"hasCompletedProfile":false,"userDismissableFlags":[32,12,8,5,21,30,2,18,1,17,33],"hasSeenIcelandOnboarding":true,"postSubscribeMembershipUpsellShownAt":0,"languageCode":"en-dk","type":"User"}},"Post":{"d417a8a65564":{"id":"d417a8a65564","versionId":"1a5e435eabe5","creatorId":"152f70c4da53","homeCollectionId":"4da7dfd21a33","title":"Material 3 for Flutter","detectedLanguage":"en","latestVersion":"1a5e435eabe5","latestPublishedVersion":"1a5e435eabe5","hasUnpublishedEdits":false,"latestRev":492,"createdAt":1673261900260,"updatedAt":1675184714576,"acceptedAt":0,"firstPublishedAt":1674028948380,"latestPublishedAt":1675184714576,"vote":false,"experimentalCss":"","displayAuthor":"","content":{"subtitle":"Sherlock Holmes and Dr Watson; peanut butter and jam; Flutter and Material! These matches are made in heaven!","postDisplay":{"coverless":true}},"virtuals":{"statusForCollection":"APPROVED","allowNotes":true,"previewImage":{"imageId":"0*RuCmIqSnK0G0kHmy.png","filter":"","backgroundSize":"","originalWidth":1024,"originalHeight":535,"strategy":"resample","height":0,"width":0},"wordCount":679,"imageCount":7,"readingTime":3.612264150943396,"subtitle":"Sherlock Holmes and Dr Watson; peanut butter and jam; Flutter and Material! These matches are made in heaven!","publishedInCount":1,"usersBySocialRecommends":[],"noIndex":false,"recommends":130,"isBookmarked":false,"tags":[{"slug":"flutter","name":"Flutter","postCount":47311,"metadata":{"postCount":47311,"coverImage":{"id":"1*t9RLfJH_3ItvRfp9zcK0Sw.png","originalWidth":2560,"originalHeight":1280,"isFeatured":true}},"type":"Tag"},{"slug":"dart","name":"Dart","postCount":14228,"metadata":{"postCount":14228,"coverImage":{"id":"1*t9RLfJH_3ItvRfp9zcK0Sw.png","originalWidth":2560,"originalHeight":1280,"isFeatured":true}},"type":"Tag"},{"slug":"material-design","name":"Material Design","postCount":3667,"metadata":{"postCount":3667,"coverImage":{"id":"1*kdOha7Em-JqNsZg0LEqhng.jpeg","originalWidth":736,"originalHeight":1104}},"type":"Tag"},{"slug":"web-development","name":"Web Development","postCount":310620,"metadata":{"postCount":310620,"coverImage":{"id":"0*OOH5MOcrUEoopLWs.JPG","originalWidth":1920,"originalHeight":1148,"isFeatured":true}},"type":"Tag"},{"slug":"mobile-app-development","name":"Mobile App Development","postCount":95959,"metadata":{"postCount":95959,"coverImage":{"id":"1*Zg8ug5zUQtOGf-1vA6sdXQ.jpeg","originalWidth":523,"originalHeight":586}},"type":"Tag"}],"socialRecommendsCount":0,"responsesCreatedCount":7,"links":{"entries":[{"url":"https://flutter.github.io/samples/web/material_3_demo/#/","alts":[],"httpStatus":200},{"url":"https://blog.codemagic.io/migrating-a-flutter-app-to-material-3/","alts":[],"httpStatus":200},{"url":"https://m3.material.io/theme-builder#/custom","alts":[],"httpStatus":200},{"url":"https://m3.material.io/","alts":[],"httpStatus":200},{"url":"https://m3.material.io/components/buttons/guidelines#07a1577b-aaf5-4824-a698-03526421058b","alts":[],"httpStatus":200},{"url":"https://flutter.dev/community","alts":[],"httpStatus":200},{"url":"https://api.flutter.dev/flutter/material/ThemeData/useMaterial3.html","alts":[],"httpStatus":200},{"url":"https://api.flutter.dev/flutter/material/Material-class.html","alts":[],"httpStatus":200},{"url":"https://api.flutter.dev/flutter/material/SnackBar-class.html","alts":[],"httpStatus":200},{"url":"https://api.flutter.dev/flutter/material/TabBar-class.html","alts":[],"httpStatus":200},{"url":"https://api.flutter.dev/flutter/material/BottomNavigationBar-class.html","alts":[],"httpStatus":200},{"url":"https://api.flutter.dev/flutter/material/Slider-class.html","alts":[],"httpStatus":200},{"url":"https://api.flutter.dev/flutter/material/NavigationBar-class.html","alts":[],"httpStatus":200},{"url":"https://master-api.flutter.dev/flutter/material/Badge-class.html","alts":[],"httpStatus":200},{"url":"https://github.com/flutter/flutter/issues/91605#issuecomment-1264995277","alts":[],"httpStatus":200}],"version":"0.3","generatedAt":1675184716317},"isLockedPreviewOnly":false,"metaDescription":"","totalClapCount":985,"sectionCount":4,"readingList":0,"topics":[{"topicId":"55f1c20aba7a","slug":"software-engineering","createdAt":1491949272237,"deletedAt":0,"image":{"id":"1*U8FboK4lz1wqwQC6IcqxKw@2x.jpeg","originalWidth":5507,"originalHeight":3098},"name":"Software Engineering","description":"Back-end to front-end.","relatedTopics":[],"visibility":1,"relatedTags":[],"relatedTopicIds":[],"seoTitle":"Software Engineering News and Articles — Medium","type":"Topic"},{"topicId":"64756708407c","slug":"android-development","createdAt":1521652914155,"deletedAt":0,"image":{"id":"1*zLD64ewnrZ3XKBtDUMXQ-w@2x.jpeg","originalWidth":3000,"originalHeight":1997},"name":"Android Dev","description":"Building little green robots.","relatedTopics":[],"visibility":1,"relatedTags":[],"relatedTopicIds":[],"seoTitle":"Android Development: Articles and News — Medium","type":"Topic"},{"topicId":"decb52b64abf","slug":"programming","createdAt":1493934116328,"deletedAt":0,"image":{"id":"1*iPa136b1cGEO7lvoXg6uHQ@2x.jpeg","originalWidth":6016,"originalHeight":4016},"name":"Programming","description":"The good, the bad, the buggy.","relatedTopics":[],"visibility":1,"relatedTags":[],"relatedTopicIds":[],"seoTitle":"Programming News and Articles — Medium","type":"Topic"}]},"coverless":true,"slug":"material-3-for-flutter","translationSourcePostId":"","translationSourceCreatorId":"","isApprovedTranslation":false,"inResponseToPostId":"","inResponseToRemovedAt":0,"isTitleSynthesized":true,"allowResponses":true,"importedUrl":"","importedPublishedAt":0,"visibility":0,"uniqueSlug":"material-3-for-flutter-d417a8a65564","previewContent":{"bodyModel":{"paragraphs":[{"name":"previewImage","type":4,"text":"","layout":10,"metadata":{"id":"0*RuCmIqSnK0G0kHmy.png","originalWidth":1024,"originalHeight":535,"isFeatured":true}},{"name":"3279","type":3,"text":"Material 3 for Flutter","markups":[],"alignment":1},{"name":"c6ce","type":13,"text":"Sherlock Holmes and Dr Watson; peanut butter and jam; Flutter and Material…","markups":[],"alignment":1}],"sections":[{"startIndex":0}]},"isFullContent":false,"subtitle":"Sherlock Holmes and Dr Watson; peanut butter and jam; Flutter and Material! These matches are made in heaven!"},"license":1,"inResponseToMediaResourceId":"","canonicalUrl":"","approvedHomeCollectionId":"4da7dfd21a33","isNewsletter":false,"newsletterId":"","webCanonicalUrl":"","mediumUrl":"","migrationId":"","notifyFollowers":true,"notifyTwitter":false,"notifyFacebook":false,"responseHiddenOnParentPostAt":0,"isSeries":false,"isSubscriptionLocked":false,"seriesLastAppendedAt":0,"audioVersionDurationSec":0,"sequenceId":"","isEligibleForRevenue":false,"isBlockedFromHightower":false,"deletedAt":0,"lockedPostSource":0,"hightowerMinimumGuaranteeStartsAt":0,"hightowerMinimumGuaranteeEndsAt":0,"featureLockRequestAcceptedAt":0,"mongerRequestType":1,"layerCake":3,"socialTitle":"","socialDek":"","editorialPreviewTitle":"","editorialPreviewDek":"","curationEligibleAt":0,"primaryTopicId":"55f1c20aba7a","isProxyPost":false,"proxyPostFaviconUrl":"","proxyPostProviderName":"","proxyPostType":0,"isSuspended":false,"isLimitedState":false,"seoTitle":"","previewContent2":{"bodyModel":{"paragraphs":[{"name":"335a","type":4,"text":"","markups":[],"layout":1,"metadata":{"id":"0*RuCmIqSnK0G0kHmy.png","originalWidth":1024,"originalHeight":535,"isFeatured":true}},{"name":"3279","type":3,"text":"Material 3 for Flutter","markups":[]},{"name":"c6ce","type":13,"text":"Sherlock Holmes and Dr Watson; peanut butter and jam; Flutter and Material! These matches are made in heaven!","markups":[]},{"name":"3a7d","type":1,"text":"Material is a design system that helps you build beautiful, accessible apps across mobile, web, and desktop.","markups":[{"type":3,"start":0,"end":8,"href":"https://m3.material.io/","title":"","rel":"","anchorType":0}]},{"name":"9757","type":1,"text":"In Flutter, the Material library provides developers with all the building blocks your UI needs. Since the launch of Material 3 at Google I/O 2021, the Flutter team has been updating Flutter’s Material…","markups":[{"type":3,"start":16,"end":32,"href":"https://api.flutter.dev/flutter/material/Material-class.html","title":"","rel":"","anchorType":0}]}],"sections":[{"name":"6f94","startIndex":0}]},"isFullContent":false,"subtitle":"Sherlock Holmes and Dr Watson; peanut butter and jam; Flutter and Material! These matches are made in heaven!"},"cardType":0,"isDistributionAlertDismissed":false,"isShortform":false,"shortformType":0,"responsesLocked":false,"isLockedResponse":false,"isPublishToEmail":false,"responseDistribution":0,"isMarkedPaywallOnly":false,"type":"Post"},"e3f3f622200b":{"id":"e3f3f622200b","versionId":"2996778c2529","creatorId":"df52ddf23910","homeCollectionId":"4da7dfd21a33","title":"Accessible expression with Material Icons and Flutter","detectedLanguage":"en","latestVersion":"2996778c2529","latestPublishedVersion":"2996778c2529","hasUnpublishedEdits":false,"latestRev":185,"createdAt":1604447841300,"updatedAt":1639654189616,"acceptedAt":0,"firstPublishedAt":1604505798594,"latestPublishedAt":1604505798594,"vote":false,"experimentalCss":"","displayAuthor":"","content":{"subtitle":"Material Design and Flutter both help developers build experiences that are flexible, accessible, and expressive…","postDisplay":{"coverless":true}},"virtuals":{"statusForCollection":"APPROVED","allowNotes":true,"previewImage":{"imageId":"1*kcT41A5GvXp8XrjHjiuc4A.png","filter":"","backgroundSize":"","originalWidth":716,"originalHeight":563,"strategy":"resample","height":0,"width":0},"wordCount":569,"imageCount":2,"readingTime":2.530503144654088,"subtitle":"Material Design and Flutter both help developers build experiences that are flexible, accessible, and expressive…","publishedInCount":1,"usersBySocialRecommends":[],"noIndex":false,"recommends":90,"isBookmarked":false,"tags":[{"slug":"icons","name":"Icons","postCount":5686,"metadata":{"postCount":5686,"coverImage":{"id":"1*i-1gVG6fXp06EHDUI_Lvdw.jpeg","originalWidth":1120,"originalHeight":1120,"isFeatured":true}},"type":"Tag"},{"slug":"material-design","name":"Material Design","postCount":3667,"metadata":{"postCount":3667,"coverImage":{"id":"1*kdOha7Em-JqNsZg0LEqhng.jpeg","originalWidth":736,"originalHeight":1104}},"type":"Tag"},{"slug":"accessibility","name":"Accessibility","postCount":19513,"metadata":{"postCount":19513,"coverImage":{"id":"1*QPPdfL7yS-dg3slYeMh7nw.jpeg","originalWidth":1800,"originalHeight":1169,"isFeatured":true}},"type":"Tag"},{"slug":"flutter","name":"Flutter","postCount":47311,"metadata":{"postCount":47311,"coverImage":{"id":"1*t9RLfJH_3ItvRfp9zcK0Sw.png","originalWidth":2560,"originalHeight":1280,"isFeatured":true}},"type":"Tag"}],"socialRecommendsCount":0,"responsesCreatedCount":2,"links":{"entries":[{"url":"https://flutter.dev/docs/development/accessibility-and-localization/accessibility","alts":[],"httpStatus":200},{"url":"https://twitter.com/materialdesign","alts":[],"httpStatus":200},{"url":"https://twitter.com/FlutterDev","alts":[],"httpStatus":200},{"url":"https://github.com/material-components/material-components-flutter/tree/develop/medium/material_icons","alts":[],"httpStatus":200},{"url":"https://material.io/resources/icons/","alts":[],"httpStatus":200},{"url":"https://material.io/design/usability/accessibility.html#writing","alts":[],"httpStatus":200},{"url":"https://material.io/resources/icons","alts":[],"httpStatus":200},{"url":"https://master-api.flutter.dev/flutter/widgets/Icon-class.html","alts":[],"httpStatus":200},{"url":"https://medium.com/@suryadevsingh24032000/size-matters-reducing-flutter-app-size-best-practices-ca992207782","alts":[{"type":3,"url":"medium://p/ca992207782"},{"type":2,"url":"medium://p/ca992207782"}],"httpStatus":200},{"url":"https://api.flutter.dev/flutter/material/Icons-class.html","alts":[],"httpStatus":200}],"version":"0.3","generatedAt":1604505800254},"isLockedPreviewOnly":false,"metaDescription":"","totalClapCount":585,"sectionCount":1,"readingList":0,"topics":[{"topicId":"decb52b64abf","slug":"programming","createdAt":1493934116328,"deletedAt":0,"image":{"id":"1*iPa136b1cGEO7lvoXg6uHQ@2x.jpeg","originalWidth":6016,"originalHeight":4016},"name":"Programming","description":"The good, the bad, the buggy.","relatedTopics":[],"visibility":1,"relatedTags":[],"relatedTopicIds":[],"seoTitle":"Programming News and Articles — Medium","type":"Topic"}]},"coverless":true,"slug":"accessible-expression-with-material-icons-and-flutter","translationSourcePostId":"","translationSourceCreatorId":"","isApprovedTranslation":false,"inResponseToPostId":"","inResponseToRemovedAt":0,"isTitleSynthesized":false,"allowResponses":true,"importedUrl":"","importedPublishedAt":0,"visibility":0,"uniqueSlug":"accessible-expression-with-material-icons-and-flutter-e3f3f622200b","previewContent":{"bodyModel":{"paragraphs":[{"name":"previewImage","type":4,"text":"","layout":10,"metadata":{"id":"1*kcT41A5GvXp8XrjHjiuc4A.png","originalWidth":716,"originalHeight":563,"isFeatured":true,"alt":"Sample of 4 icons: shopping_cart, chat, masks, wash shown in the 4 supported styles: filled, outlined, rounded, sharp."}},{"name":"9944","type":3,"text":"Accessible expression with Material Icons and Flutter","markups":[],"alignment":1}],"sections":[{"startIndex":0}]},"isFullContent":false,"subtitle":"Material Design and Flutter both help developers build experiences that are flexible, accessible, and expressive…"},"license":0,"inResponseToMediaResourceId":"","canonicalUrl":"","approvedHomeCollectionId":"4da7dfd21a33","isNewsletter":false,"newsletterId":"","webCanonicalUrl":"","mediumUrl":"","migrationId":"","notifyFollowers":true,"notifyTwitter":false,"notifyFacebook":false,"responseHiddenOnParentPostAt":0,"isSeries":false,"isSubscriptionLocked":false,"seriesLastAppendedAt":0,"audioVersionDurationSec":0,"sequenceId":"","isEligibleForRevenue":false,"isBlockedFromHightower":false,"deletedAt":0,"lockedPostSource":0,"hightowerMinimumGuaranteeStartsAt":0,"hightowerMinimumGuaranteeEndsAt":0,"featureLockRequestAcceptedAt":0,"mongerRequestType":1,"layerCake":3,"socialTitle":"","socialDek":"","editorialPreviewTitle":"","editorialPreviewDek":"","curationEligibleAt":0,"primaryTopicId":"decb52b64abf","isProxyPost":false,"proxyPostFaviconUrl":"","proxyPostProviderName":"","proxyPostType":0,"isSuspended":false,"isLimitedState":false,"seoTitle":"","previewContent2":{"bodyModel":{"paragraphs":[{"name":"9944","type":3,"text":"Accessible expression with Material Icons and Flutter","markups":[]},{"name":"a8cd","type":1,"text":"Material Design and Flutter both help developers build experiences that are flexible, accessible, and expressive, while delivering great performance and efficiency. Now we’re pleased to give you even more ways to create distinctive UIs with improved support for Material Icons in Flutter.","markups":[]},{"name":"98ac","type":1,"text":"Material Icons are beautifully crafted symbols for common…","markups":[{"type":3,"start":0,"end":14,"href":"https://material.io/resources/icons","title":"","rel":"","anchorType":0}]}],"sections":[{"name":"f3af","startIndex":0}]},"isFullContent":false,"subtitle":"Material Design and Flutter both help developers build experiences that are flexible, accessible, and expressive…"},"cardType":0,"isDistributionAlertDismissed":false,"isShortform":false,"shortformType":0,"responsesLocked":false,"isLockedResponse":false,"isPublishToEmail":false,"responseDistribution":0,"isMarkedPaywallOnly":false,"type":"Post"},"ce48a22611a3":{"id":"ce48a22611a3","versionId":"a270ae9a02b7","creatorId":"a8e501ba3326","homeCollectionId":"4da7dfd21a33","title":"What’s new with the Slider widget?","detectedLanguage":"en","latestVersion":"a270ae9a02b7","latestPublishedVersion":"a270ae9a02b7","hasUnpublishedEdits":false,"latestRev":347,"createdAt":1592503112318,"updatedAt":1639519421505,"acceptedAt":0,"firstPublishedAt":1592512335085,"latestPublishedAt":1599133443640,"vote":false,"experimentalCss":"","displayAuthor":"","content":{"subtitle":"Flutter lets you create beautiful, natively compiled applications. The reason Flutter can do this is because Flutter loves Material…","postDisplay":{"coverless":true}},"virtuals":{"statusForCollection":"APPROVED","allowNotes":true,"previewImage":{"imageId":"1*0vbyZT-NITTvqljO8HtU4w.png","filter":"","backgroundSize":"","originalWidth":3042,"originalHeight":1740,"strategy":"resample","height":0,"width":0},"wordCount":1209,"imageCount":13,"readingTime":5.962264150943396,"subtitle":"Flutter lets you create beautiful, natively compiled applications. The reason Flutter can do this is because Flutter loves Material…","publishedInCount":1,"usersBySocialRecommends":[],"noIndex":false,"recommends":134,"isBookmarked":false,"tags":[{"slug":"flutter","name":"Flutter","postCount":47311,"metadata":{"postCount":47311,"coverImage":{"id":"1*t9RLfJH_3ItvRfp9zcK0Sw.png","originalWidth":2560,"originalHeight":1280,"isFeatured":true}},"type":"Tag"},{"slug":"slider","name":"Slider","postCount":724,"metadata":{"postCount":724,"coverImage":{"id":"1*1S7pEq582j7HjZm5x7SIQA.gif","originalWidth":295,"originalHeight":640,"isFeatured":true}},"type":"Tag"},{"slug":"material-design","name":"Material Design","postCount":3667,"metadata":{"postCount":3667,"coverImage":{"id":"1*kdOha7Em-JqNsZg0LEqhng.jpeg","originalWidth":736,"originalHeight":1104}},"type":"Tag"},{"slug":"dart","name":"Dart","postCount":14228,"metadata":{"postCount":14228,"coverImage":{"id":"1*t9RLfJH_3ItvRfp9zcK0Sw.png","originalWidth":2560,"originalHeight":1280,"isFeatured":true}},"type":"Tag"},{"slug":"range-slider","name":"Range Slider","postCount":11,"metadata":{"postCount":11,"coverImage":{"id":"1*M9MO6I3KEFan5pAa9JMJLw.png","originalWidth":1236,"originalHeight":247,"isFeatured":true}},"type":"Tag"}],"socialRecommendsCount":0,"responsesCreatedCount":1,"links":{"entries":[{"url":"https://github.com/JoseAlba","alts":[],"httpStatus":200},{"url":"https://api.flutter.dev/flutter/rendering/LayerLink-class.html","alts":[],"httpStatus":200},{"url":"https://medium.com/flutter/how-to-float-an-overlay-widget-over-a-possibly-transformed-ui-widget-1d15ca7667b6","alts":[{"type":2,"url":"medium://p/1d15ca7667b6"},{"type":3,"url":"medium://p/1d15ca7667b6"}],"httpStatus":200},{"url":"https://medium.com/flutter/material-range-slider-in-flutter-a285c6e3447d","alts":[{"type":3,"url":"medium://p/a285c6e3447d"},{"type":2,"url":"medium://p/a285c6e3447d"}],"httpStatus":200},{"url":"https://api.flutter.dev/flutter/material/material-library.html","alts":[],"httpStatus":200},{"url":"https://master-api.flutter.dev/flutter/material/RectangularSliderValueIndicatorShape-class.html","alts":[],"httpStatus":200},{"url":"https://www.linkedin.com/in/josealba1996/","alts":[],"httpStatus":999},{"url":"https://material.io/","alts":[],"httpStatus":200},{"url":"https://www.youtube.com/channel/UCOdKA_On0oPe1tz02z1QfxA?view_as=subscriber","alts":[],"httpStatus":200},{"url":"https://api.flutter.dev/flutter/material/RangeSlider-class.html","alts":[],"httpStatus":200},{"url":"https://material.io","alts":[],"httpStatus":200},{"url":"https://api.flutter.dev/flutter/widgets/CompositedTransformFollower-class.html","alts":[],"httpStatus":200},{"url":"https://api.flutter.dev/flutter/material/Slider-class.html","alts":[],"httpStatus":200},{"url":"https://master-api.flutter.dev/flutter/material/RectangularRangeSliderValueIndicatorShape-class.html","alts":[],"httpStatus":200},{"url":"https://api.flutter.dev/flutter/widgets/CompositedTransformTarget-class.html","alts":[],"httpStatus":200},{"url":"https://www.instagram.com/jose.alba/","alts":[],"httpStatus":200},{"url":"https://api.flutter.dev/flutter/widgets/Overlay-class.html","alts":[],"httpStatus":200}],"version":"0.3","generatedAt":1599133443826},"isLockedPreviewOnly":false,"metaDescription":"","totalClapCount":835,"sectionCount":1,"readingList":0,"topics":[{"topicId":"decb52b64abf","slug":"programming","createdAt":1493934116328,"deletedAt":0,"image":{"id":"1*iPa136b1cGEO7lvoXg6uHQ@2x.jpeg","originalWidth":6016,"originalHeight":4016},"name":"Programming","description":"The good, the bad, the buggy.","relatedTopics":[],"visibility":1,"relatedTags":[],"relatedTopicIds":[],"seoTitle":"Programming News and Articles — Medium","type":"Topic"}]},"coverless":true,"slug":"whats-new-with-the-slider-widget","translationSourcePostId":"","translationSourceCreatorId":"","isApprovedTranslation":false,"inResponseToPostId":"","inResponseToRemovedAt":0,"isTitleSynthesized":false,"allowResponses":true,"importedUrl":"","importedPublishedAt":0,"visibility":0,"uniqueSlug":"whats-new-with-the-slider-widget-ce48a22611a3","previewContent":{"bodyModel":{"paragraphs":[{"name":"previewImage","type":4,"text":"","layout":10,"metadata":{"id":"1*0vbyZT-NITTvqljO8HtU4w.png","originalWidth":3042,"originalHeight":1740,"isFeatured":true}},{"name":"15f7","type":3,"text":"What’s new with the Slider widget?","markups":[],"alignment":1},{"name":"f65e","type":1,"text":"Flutter lets you create beautiful, natively compiled applications. The reason Flutter can do this…","markups":[],"alignment":1}],"sections":[{"startIndex":0}]},"isFullContent":false,"subtitle":"Flutter lets you create beautiful, natively compiled applications. The reason Flutter can do this is because Flutter loves Material…"},"license":0,"inResponseToMediaResourceId":"","canonicalUrl":"","approvedHomeCollectionId":"4da7dfd21a33","isNewsletter":false,"newsletterId":"","webCanonicalUrl":"","mediumUrl":"","migrationId":"","notifyFollowers":true,"notifyTwitter":false,"notifyFacebook":false,"responseHiddenOnParentPostAt":0,"isSeries":false,"isSubscriptionLocked":false,"seriesLastAppendedAt":0,"audioVersionDurationSec":0,"sequenceId":"","isEligibleForRevenue":false,"isBlockedFromHightower":false,"deletedAt":0,"lockedPostSource":0,"hightowerMinimumGuaranteeStartsAt":0,"hightowerMinimumGuaranteeEndsAt":0,"featureLockRequestAcceptedAt":0,"mongerRequestType":1,"layerCake":3,"socialTitle":"","socialDek":"","editorialPreviewTitle":"","editorialPreviewDek":"","curationEligibleAt":0,"primaryTopicId":"decb52b64abf","isProxyPost":false,"proxyPostFaviconUrl":"","proxyPostProviderName":"","proxyPostType":0,"isSuspended":false,"isLimitedState":false,"seoTitle":"","previewContent2":{"bodyModel":{"paragraphs":[{"name":"15f7","type":3,"text":"What’s new with the Slider widget?","markups":[]},{"name":"755a","type":4,"text":"","markups":[],"layout":1,"metadata":{"id":"1*0vbyZT-NITTvqljO8HtU4w.png","originalWidth":3042,"originalHeight":1740,"isFeatured":true}},{"name":"f65e","type":1,"text":"Flutter lets you create beautiful, natively compiled applications. The reason Flutter can do this is because Flutter loves Material. Material is a design system that helps build high-quality, digital experiences. As UI design continues to evolve, Material continues to update its components, motion, and design system.","markups":[{"type":3,"start":133,"end":141,"href":"https://material.io","title":"","rel":"","anchorType":0}]},{"name":"8d90","type":1,"text":"Flutter recently updated the…","markups":[{"type":10,"start":29,"end":35},{"type":10,"start":40,"end":51},{"type":3,"start":29,"end":35,"href":"https://api.flutter.dev/flutter/material/Slider-class.html","title":"","rel":"","anchorType":0},{"type":3,"start":40,"end":51,"href":"https://api.flutter.dev/flutter/material/RangeSlider-class.html","title":"","rel":"","anchorType":0}]}],"sections":[{"name":"2145","startIndex":0}]},"isFullContent":false,"subtitle":"Flutter lets you create beautiful, natively compiled applications. The reason Flutter can do this is because Flutter loves Material…"},"cardType":0,"isDistributionAlertDismissed":true,"isShortform":false,"shortformType":0,"responsesLocked":false,"isLockedResponse":false,"isPublishToEmail":false,"responseDistribution":0,"isMarkedPaywallOnly":false,"type":"Post"},"535fbe3cd674":{"id":"535fbe3cd674","versionId":"6339949a719d","creatorId":"4cad326de3d7","homeCollectionId":"4da7dfd21a33","title":"Optimizing performance in Flutter web apps with tree shaking and deferred loading","detectedLanguage":"en","latestVersion":"6339949a719d","latestPublishedVersion":"6339949a719d","hasUnpublishedEdits":false,"latestRev":325,"createdAt":1589540441354,"updatedAt":1639492972476,"acceptedAt":0,"firstPublishedAt":1589896669784,"latestPublishedAt":1595505320357,"vote":false,"experimentalCss":"","displayAuthor":"","content":{"subtitle":"For the best user experience it is important that an app loads fast. The initial load time of a Flutter web application can be improved by…","postDisplay":{"coverless":true}},"virtuals":{"statusForCollection":"APPROVED","allowNotes":true,"previewImage":{"imageId":"0*Z8CmvWbWVXUb9Wy4","filter":"","backgroundSize":"","originalWidth":1374,"originalHeight":532,"strategy":"resample","height":0,"width":0},"wordCount":774,"imageCount":1,"readingTime":3.120754716981132,"subtitle":"For the best user experience it is important that an app loads fast. The initial load time of a Flutter web application can be improved by…","publishedInCount":1,"usersBySocialRecommends":[],"noIndex":false,"recommends":189,"isBookmarked":false,"tags":[{"slug":"flutter-web","name":"Flutter Web","postCount":1752,"metadata":{"postCount":1752,"coverImage":{"id":"0*_bz3_DRzn9aoB0qD","originalWidth":1600,"originalHeight":800,"isFeatured":true}},"type":"Tag"},{"slug":"flutter","name":"Flutter","postCount":47311,"metadata":{"postCount":47311,"coverImage":{"id":"1*t9RLfJH_3ItvRfp9zcK0Sw.png","originalWidth":2560,"originalHeight":1280,"isFeatured":true}},"type":"Tag"},{"slug":"material-design","name":"Material Design","postCount":3667,"metadata":{"postCount":3667,"coverImage":{"id":"1*kdOha7Em-JqNsZg0LEqhng.jpeg","originalWidth":736,"originalHeight":1104}},"type":"Tag"},{"slug":"performance","name":"Performance","postCount":29351,"metadata":{"postCount":29351,"coverImage":{"id":"1*h5ULv-tGdDA3yD2c685lFQ.png","originalWidth":1400,"originalHeight":682,"isFeatured":true}},"type":"Tag"}],"socialRecommendsCount":0,"responsesCreatedCount":8,"links":{"entries":[{"url":"https://gallery.flutter.dev/#/","alts":[],"httpStatus":200},{"url":"https://en.wikipedia.org/wiki/Tree_shaking","alts":[],"httpStatus":200},{"url":"https://dart.dev/tools/dart2js","alts":[],"httpStatus":200},{"url":"https://dart.dev/guides/language/language-tour#deferred-loading","alts":[],"httpStatus":200},{"url":"https://api.flutter.dev/flutter/widgets/FutureBuilder-class.html","alts":[],"httpStatus":200},{"url":"https://developers.google.com/web/tools/chrome-devtools/network","alts":[],"httpStatus":200},{"url":"https://medium.com/flutter/improving-perceived-performance-with-image-placeholders-precaching-and-disabled-navigation-6b3601087a2b","alts":[{"type":3,"url":"medium://p/6b3601087a2b"},{"type":2,"url":"medium://p/6b3601087a2b"}],"httpStatus":200},{"url":"http://gallery.flutter.dev/","alts":[],"httpStatus":200},{"url":"https://github.com/flutter/flutter/blob/7b1d24216e00eaa58ca04cc2d8911329fea991be/packages/flutter_tools/lib/src/build_system/targets/web.dart#L200","alts":[],"httpStatus":200},{"url":"https://github.com/perclasson/flutter_code/tree/master/deferred_loading","alts":[],"httpStatus":200},{"url":"https://medium.com/flutter/building-performant-flutter-widgets-3b2558aa08fa","alts":[{"type":3,"url":"medium://p/3b2558aa08fa"},{"type":2,"url":"medium://p/3b2558aa08fa"}],"httpStatus":200},{"url":"https://github.com/flutter/flutter/blob/master/dev/tools/localization/bin/gen_l10n.dart","alts":[],"httpStatus":200}],"version":"0.3","generatedAt":1595505321063},"isLockedPreviewOnly":false,"metaDescription":"","totalClapCount":1592,"sectionCount":1,"readingList":0,"topics":[{"topicId":"63c6f1f93ee","slug":"javascript","createdAt":1493945704961,"deletedAt":0,"image":{"id":"1*5UyyDJ1ESD11yQNd1UVAaQ@2x.jpeg","originalWidth":5472,"originalHeight":3648},"name":"Javascript","description":"An ode to code.","relatedTopics":[],"visibility":1,"relatedTags":[],"relatedTopicIds":[],"seoTitle":"Javascript News and Articles — Medium","type":"Topic"},{"topicId":"decb52b64abf","slug":"programming","createdAt":1493934116328,"deletedAt":0,"image":{"id":"1*iPa136b1cGEO7lvoXg6uHQ@2x.jpeg","originalWidth":6016,"originalHeight":4016},"name":"Programming","description":"The good, the bad, the buggy.","relatedTopics":[],"visibility":1,"relatedTags":[],"relatedTopicIds":[],"seoTitle":"Programming News and Articles — Medium","type":"Topic"}]},"coverless":true,"slug":"optimizing-performance-in-flutter-web-apps-with-tree-shaking-and-deferred-loading","translationSourcePostId":"","translationSourceCreatorId":"","isApprovedTranslation":false,"inResponseToPostId":"","inResponseToRemovedAt":0,"isTitleSynthesized":false,"allowResponses":true,"importedUrl":"","importedPublishedAt":0,"visibility":0,"uniqueSlug":"optimizing-performance-in-flutter-web-apps-with-tree-shaking-and-deferred-loading-535fbe3cd674","previewContent":{"bodyModel":{"paragraphs":[{"name":"previewImage","type":4,"text":"","layout":10,"metadata":{"id":"0*Z8CmvWbWVXUb9Wy4","originalWidth":1374,"originalHeight":532,"isFeatured":true}},{"name":"a3e7","type":3,"text":"Optimizing performance in Flutter web apps with tree shaking and deferred loading","markups":[],"alignment":1}],"sections":[{"startIndex":0}]},"isFullContent":false,"subtitle":"For the best user experience it is important that an app loads fast. The initial load time of a Flutter web application can be improved by…"},"license":0,"inResponseToMediaResourceId":"","canonicalUrl":"","approvedHomeCollectionId":"4da7dfd21a33","isNewsletter":false,"newsletterId":"","webCanonicalUrl":"","mediumUrl":"","migrationId":"","notifyFollowers":true,"notifyTwitter":false,"notifyFacebook":false,"responseHiddenOnParentPostAt":0,"isSeries":false,"isSubscriptionLocked":false,"seriesLastAppendedAt":0,"audioVersionDurationSec":0,"sequenceId":"","isEligibleForRevenue":false,"isBlockedFromHightower":false,"deletedAt":0,"lockedPostSource":0,"hightowerMinimumGuaranteeStartsAt":0,"hightowerMinimumGuaranteeEndsAt":0,"featureLockRequestAcceptedAt":0,"mongerRequestType":1,"layerCake":4,"socialTitle":"","socialDek":"","editorialPreviewTitle":"","editorialPreviewDek":"","curationEligibleAt":0,"isProxyPost":false,"proxyPostFaviconUrl":"","proxyPostProviderName":"","proxyPostType":0,"isSuspended":false,"isLimitedState":false,"seoTitle":"","previewContent2":{"bodyModel":{"paragraphs":[{"name":"a3e7","type":3,"text":"Optimizing performance in Flutter web apps with tree shaking and deferred loading","markups":[]},{"name":"305b","type":1,"text":"For the best user experience it is important that an app loads fast. The initial load time of a Flutter web application can be improved by minimizing its JavaScript bundle. The Dart compiler includes features such as tree shaking and deferred loading, both of which minimize the JavaScript bundle. This…","markups":[]}],"sections":[{"name":"19d5","startIndex":0}]},"isFullContent":false,"subtitle":"For the best user experience it is important that an app loads fast. The initial load time of a Flutter web application can be improved by…"},"cardType":0,"isDistributionAlertDismissed":true,"isShortform":false,"shortformType":0,"responsesLocked":false,"isLockedResponse":false,"isPublishToEmail":false,"responseDistribution":0,"isMarkedPaywallOnly":false,"type":"Post"},"c0e993617118":{"id":"c0e993617118","versionId":"ecf15dd864a9","creatorId":"40a15fe2c58f","homeCollectionId":"4da7dfd21a33","title":"Introducing Google Fonts for Flutter v 1.0.0!","detectedLanguage":"en","latestVersion":"ecf15dd864a9","latestPublishedVersion":"ecf15dd864a9","hasUnpublishedEdits":false,"latestRev":107,"createdAt":1587588539119,"updatedAt":1639465021458,"acceptedAt":0,"firstPublishedAt":1587650461302,"latestPublishedAt":1599579916602,"vote":false,"experimentalCss":"","displayAuthor":"","content":{"subtitle":"By MH Johnson and Anthony Robledo","postDisplay":{"coverless":true}},"virtuals":{"statusForCollection":"APPROVED","allowNotes":true,"previewImage":{"imageId":"1*ndZ8HED7jp2f0X4IFSwtdA.png","filter":"","backgroundSize":"","originalWidth":1200,"originalHeight":400,"strategy":"resample","height":0,"width":0},"wordCount":273,"imageCount":2,"readingTime":1.4135220125786163,"subtitle":"By MH Johnson and Anthony Robledo","publishedInCount":1,"usersBySocialRecommends":[],"noIndex":false,"recommends":282,"isBookmarked":false,"tags":[{"slug":"google-fonts","name":"Google Fonts","postCount":313,"metadata":{"postCount":313,"coverImage":{"id":"1*xnNU6QnXvA8dp_-88iVoIw.jpeg","originalWidth":921,"originalHeight":572,"isFeatured":true}},"type":"Tag"},{"slug":"flutter","name":"Flutter","postCount":47311,"metadata":{"postCount":47311,"coverImage":{"id":"1*t9RLfJH_3ItvRfp9zcK0Sw.png","originalWidth":2560,"originalHeight":1280,"isFeatured":true}},"type":"Tag"},{"slug":"typography","name":"Typography","postCount":11003,"metadata":{"postCount":11003,"coverImage":{"id":"1*cktZKh086XlJna3_i9SxiQ.jpeg","originalWidth":2101,"originalHeight":1347,"isFeatured":true}},"type":"Tag"},{"slug":"pub","name":"Pub","postCount":1713,"metadata":{"postCount":1713,"coverImage":{"id":"1*x9gyXsjNPJ_R2stKHEVEsw.jpeg","originalWidth":4284,"originalHeight":4617,"isFeatured":true}},"type":"Tag"},{"slug":"material-design","name":"Material Design","postCount":3667,"metadata":{"postCount":3667,"coverImage":{"id":"1*kdOha7Em-JqNsZg0LEqhng.jpeg","originalWidth":736,"originalHeight":1104}},"type":"Tag"}],"socialRecommendsCount":0,"responsesCreatedCount":8,"links":{"entries":[{"url":"https://pub.dev/packages/google_fonts","alts":[],"httpStatus":200},{"url":"https://github.com/material-foundation/google-fonts-flutter/issues","alts":[],"httpStatus":200}],"version":"0.3","generatedAt":1599579917020},"isLockedPreviewOnly":false,"metaDescription":"","totalClapCount":1617,"sectionCount":1,"readingList":0,"topics":[{"topicId":"decb52b64abf","slug":"programming","createdAt":1493934116328,"deletedAt":0,"image":{"id":"1*iPa136b1cGEO7lvoXg6uHQ@2x.jpeg","originalWidth":6016,"originalHeight":4016},"name":"Programming","description":"The good, the bad, the buggy.","relatedTopics":[],"visibility":1,"relatedTags":[],"relatedTopicIds":[],"seoTitle":"Programming News and Articles — Medium","type":"Topic"}]},"coverless":true,"slug":"introducing-google-fonts-for-flutter-v-1-0-0","translationSourcePostId":"","translationSourceCreatorId":"","isApprovedTranslation":false,"inResponseToPostId":"","inResponseToRemovedAt":0,"isTitleSynthesized":false,"allowResponses":true,"importedUrl":"","importedPublishedAt":0,"visibility":0,"uniqueSlug":"introducing-google-fonts-for-flutter-v-1-0-0-c0e993617118","previewContent":{"bodyModel":{"paragraphs":[{"name":"7e04","type":3,"text":"Introducing Google Fonts for Flutter v 1.0.0!","markups":[],"alignment":1},{"name":"773a","type":1,"text":"By Anthony Robledo and MH Johnson","markups":[{"type":3,"start":3,"end":18,"anchorType":2,"userId":"40a15fe2c58f"},{"type":3,"start":23,"end":33,"anchorType":2,"userId":"4152a8734e54"}],"alignment":1},{"name":"9b99","type":4,"text":"","markups":[],"layout":9,"metadata":{"id":"1*ndZ8HED7jp2f0X4IFSwtdA.png","originalWidth":1200,"originalHeight":400}}],"sections":[{"startIndex":0}]},"isFullContent":false,"subtitle":"By MH Johnson and Anthony Robledo"},"license":0,"inResponseToMediaResourceId":"","canonicalUrl":"","approvedHomeCollectionId":"4da7dfd21a33","isNewsletter":false,"newsletterId":"","webCanonicalUrl":"","mediumUrl":"","migrationId":"","notifyFollowers":true,"notifyTwitter":false,"notifyFacebook":false,"responseHiddenOnParentPostAt":0,"isSeries":false,"isSubscriptionLocked":false,"seriesLastAppendedAt":0,"audioVersionDurationSec":0,"sequenceId":"","isEligibleForRevenue":false,"isBlockedFromHightower":false,"deletedAt":0,"lockedPostSource":0,"hightowerMinimumGuaranteeStartsAt":0,"hightowerMinimumGuaranteeEndsAt":0,"featureLockRequestAcceptedAt":0,"mongerRequestType":1,"layerCake":0,"socialTitle":"","socialDek":"","editorialPreviewTitle":"","editorialPreviewDek":"","curationEligibleAt":0,"isProxyPost":false,"proxyPostFaviconUrl":"","proxyPostProviderName":"","proxyPostType":0,"isSuspended":false,"isLimitedState":false,"seoTitle":"","previewContent2":{"bodyModel":{"paragraphs":[{"name":"7e04","type":3,"text":"Introducing Google Fonts for Flutter v 1.0.0!","markups":[]},{"name":"773a","type":1,"text":"By Anthony Robledo and MH Johnson","markups":[{"type":3,"start":3,"end":18,"anchorType":2,"userId":"40a15fe2c58f"},{"type":3,"start":23,"end":33,"anchorType":2,"userId":"4152a8734e54"}]},{"name":"9b99","type":4,"text":"","markups":[],"layout":1,"metadata":{"id":"1*ndZ8HED7jp2f0X4IFSwtdA.png","originalWidth":1200,"originalHeight":400}},{"name":"523a","type":1,"text":"Google Fonts for Flutter was first announced at Flutter Interact in December 2019. With help from the community (thank you!), we have added many new features and improved stability. After a successful time in beta, it is now ready for prime time use on…","markups":[{"type":3,"start":286,"end":304,"href":"https://pub.dev/packages/google_fonts","title":"","rel":"","anchorType":0}]}],"sections":[{"name":"2b04","startIndex":0}]},"isFullContent":false,"subtitle":"By MH Johnson and Anthony Robledo"},"cardType":0,"isDistributionAlertDismissed":true,"isShortform":false,"shortformType":0,"responsesLocked":false,"isLockedResponse":false,"isPublishToEmail":false,"responseDistribution":0,"isMarkedPaywallOnly":false,"type":"Post"},"a285c6e3447d":{"id":"a285c6e3447d","versionId":"bb65aadaa272","creatorId":"40a15fe2c58f","homeCollectionId":"4da7dfd21a33","title":"Material Range Slider in Flutter","detectedLanguage":"en","latestVersion":"bb65aadaa272","latestPublishedVersion":"bb65aadaa272","hasUnpublishedEdits":false,"latestRev":612,"createdAt":1562615270955,"updatedAt":1639164763658,"acceptedAt":0,"firstPublishedAt":1562857591420,"latestPublishedAt":1596241838942,"vote":false,"experimentalCss":"","displayAuthor":"","content":{"subtitle":"What is it? Why might you use it? How do you theme it?","postDisplay":{"coverless":true}},"virtuals":{"statusForCollection":"APPROVED","allowNotes":true,"previewImage":{"imageId":"0*wtmSldtwjSvtRtuI","filter":"","backgroundSize":"","originalWidth":1600,"originalHeight":800,"strategy":"resample","height":0,"width":0},"wordCount":1473,"imageCount":9,"readingTime":6.758490566037736,"subtitle":"What is it? Why might you use it? How do you theme it?","publishedInCount":1,"usersBySocialRecommends":[],"noIndex":false,"recommends":265,"isBookmarked":false,"tags":[{"slug":"flutter","name":"Flutter","postCount":47311,"metadata":{"postCount":47311,"coverImage":{"id":"1*t9RLfJH_3ItvRfp9zcK0Sw.png","originalWidth":2560,"originalHeight":1280,"isFeatured":true}},"type":"Tag"},{"slug":"material-design","name":"Material Design","postCount":3667,"metadata":{"postCount":3667,"coverImage":{"id":"1*kdOha7Em-JqNsZg0LEqhng.jpeg","originalWidth":736,"originalHeight":1104}},"type":"Tag"},{"slug":"flutter-widget","name":"Flutter Widget","postCount":5300,"metadata":{"postCount":5300,"coverImage":{"id":"0*uNRC1pQFMPVy-3Ly.png","originalWidth":1280,"originalHeight":720,"isFeatured":true}},"type":"Tag"},{"slug":"range-slider","name":"Range Slider","postCount":11,"metadata":{"postCount":11,"coverImage":{"id":"1*M9MO6I3KEFan5pAa9JMJLw.png","originalWidth":1236,"originalHeight":247,"isFeatured":true}},"type":"Tag"},{"slug":"slider","name":"Slider","postCount":724,"metadata":{"postCount":724,"coverImage":{"id":"1*1S7pEq582j7HjZm5x7SIQA.gif","originalWidth":295,"originalHeight":640,"isFeatured":true}},"type":"Tag"}],"socialRecommendsCount":0,"responsesCreatedCount":6,"links":{"entries":[{"url":"https://github.com/flutter/flutter/tree/master/examples/flutter_gallery/lib/demo/material","alts":[],"httpStatus":404},{"url":"https://github.com/flutter/flutter/tree/master/packages/flutter/lib/src/material","alts":[],"httpStatus":200},{"url":"https://www.youtube.com/watch?v=YSULAJf6R6M&t=410s","alts":[],"httpStatus":429},{"url":"https://medium.com/flutter/whats-new-with-the-slider-widget-ce48a22611a3","alts":[{"type":3,"url":"medium://p/ce48a22611a3"},{"type":2,"url":"medium://p/ce48a22611a3"}],"httpStatus":200}],"version":"0.3","generatedAt":1596241839859},"isLockedPreviewOnly":false,"metaDescription":"","totalClapCount":1597,"sectionCount":1,"readingList":0,"topics":[{"topicId":"64756708407c","slug":"android-development","createdAt":1521652914155,"deletedAt":0,"image":{"id":"1*zLD64ewnrZ3XKBtDUMXQ-w@2x.jpeg","originalWidth":3000,"originalHeight":1997},"name":"Android Dev","description":"Building little green robots.","relatedTopics":[],"visibility":1,"relatedTags":[],"relatedTopicIds":[],"seoTitle":"Android Development: Articles and News — Medium","type":"Topic"},{"topicId":"ab3d8f7f8eb1","slug":"ios-development","createdAt":1521651850182,"deletedAt":0,"image":{"id":"1*g_B4JNulmfXSj0AyEjImyA@2x.jpeg","originalWidth":5184,"originalHeight":3456},"name":"iOS Dev","description":"Appy talk.","relatedTopics":[],"visibility":1,"relatedTags":[],"relatedTopicIds":[],"seoTitle":"iOS App Development: Articles and News — Medium","type":"Topic"},{"topicId":"decb52b64abf","slug":"programming","createdAt":1493934116328,"deletedAt":0,"image":{"id":"1*iPa136b1cGEO7lvoXg6uHQ@2x.jpeg","originalWidth":6016,"originalHeight":4016},"name":"Programming","description":"The good, the bad, the buggy.","relatedTopics":[],"visibility":1,"relatedTags":[],"relatedTopicIds":[],"seoTitle":"Programming News and Articles — Medium","type":"Topic"}]},"coverless":true,"slug":"material-range-slider-in-flutter","translationSourcePostId":"","translationSourceCreatorId":"","isApprovedTranslation":false,"inResponseToPostId":"","inResponseToRemovedAt":0,"isTitleSynthesized":false,"allowResponses":true,"importedUrl":"","importedPublishedAt":0,"visibility":0,"uniqueSlug":"material-range-slider-in-flutter-a285c6e3447d","previewContent":{"bodyModel":{"paragraphs":[{"name":"previewImage","type":4,"text":"","layout":10,"metadata":{"id":"0*wtmSldtwjSvtRtuI","originalWidth":1600,"originalHeight":800,"isFeatured":true}},{"name":"previewTitle","type":3,"text":"Material Range Slider in Flutter","alignment":1},{"name":"previewSubtitle","type":13,"text":"What is it? Why might you use it? How do you theme it?","alignment":1}],"sections":[{"startIndex":0}]},"isFullContent":false,"subtitle":"What is it? Why might you use it? How do you theme it?"},"license":0,"inResponseToMediaResourceId":"","canonicalUrl":"","approvedHomeCollectionId":"4da7dfd21a33","isNewsletter":false,"newsletterId":"","webCanonicalUrl":"","mediumUrl":"","migrationId":"","notifyFollowers":true,"notifyTwitter":false,"notifyFacebook":false,"responseHiddenOnParentPostAt":0,"isSeries":false,"isSubscriptionLocked":false,"seriesLastAppendedAt":0,"audioVersionDurationSec":0,"sequenceId":"","isEligibleForRevenue":false,"isBlockedFromHightower":false,"deletedAt":0,"lockedPostSource":0,"hightowerMinimumGuaranteeStartsAt":0,"hightowerMinimumGuaranteeEndsAt":0,"featureLockRequestAcceptedAt":0,"mongerRequestType":1,"layerCake":3,"socialTitle":"","socialDek":"","editorialPreviewTitle":"","editorialPreviewDek":"","curationEligibleAt":0,"primaryTopicId":"ab3d8f7f8eb1","isProxyPost":false,"proxyPostFaviconUrl":"","proxyPostProviderName":"","proxyPostType":0,"isSuspended":false,"isLimitedState":false,"seoTitle":"","previewContent2":{"bodyModel":{"paragraphs":[{"name":"d22c","type":3,"text":"Material RangeSlider in Flutter","markups":[]},{"name":"f751","type":1,"text":"The range slider, a highly customizable component for selecting a range of values, has been released in Flutter 1.7. This article explains what a range slider is, why you might use it, and how you can use Material Theming to customize the behavior and appearance of the Flutter RangeSlider.e","markups":[{"type":10,"start":278,"end":289}]},{"name":"abf2","type":6,"text":"Note…","markups":[{"type":10,"start":36,"end":42},{"type":10,"start":47,"end":58},{"type":3,"start":72,"end":106,"href":"https://medium.com/flutter/whats-new-with-the-slider-widget-ce48a22611a3","title":"","rel":"","anchorType":0}]}],"sections":[{"name":"df68","startIndex":0}]},"isFullContent":false,"subtitle":"What is it? Why might you use it? How do you theme it?"},"cardType":0,"isDistributionAlertDismissed":true,"isShortform":false,"shortformType":0,"responsesLocked":false,"isLockedResponse":false,"isPublishToEmail":false,"responseDistribution":0,"isMarkedPaywallOnly":false,"type":"Post"},"13ae9279ef19":{"id":"13ae9279ef19","versionId":"cc3c556cc69","creatorId":"a6d788faa5e5","homeCollectionId":"4da7dfd21a33","title":"Building beautiful, flexible user interfaces with Flutter, Material Theming, and official Material…","detectedLanguage":"en","latestVersion":"cc3c556cc69","latestPublishedVersion":"cc3c556cc69","hasUnpublishedEdits":false,"latestRev":148,"createdAt":1525967141096,"updatedAt":1529576788644,"acceptedAt":0,"firstPublishedAt":1525979492163,"latestPublishedAt":1525979492163,"vote":false,"experimentalCss":"","displayAuthor":"","content":{"subtitle":"At Google I/O 2018, the Material team announced a important update to Material Design, with a strong focus on enabling mobile apps to stand…","postDisplay":{"coverless":true}},"virtuals":{"statusForCollection":"APPROVED","allowNotes":true,"previewImage":{"imageId":"1*cyTGpzWuHqvYFGTV7uQyXA.png","filter":"","backgroundSize":"","originalWidth":2500,"originalHeight":1406,"strategy":"resample","height":0,"width":0},"wordCount":514,"imageCount":3,"readingTime":2.489622641509434,"subtitle":"At Google I/O 2018, the Material team announced a important update to Material Design, with a strong focus on enabling mobile apps to stand…","publishedInCount":1,"usersBySocialRecommends":[],"noIndex":false,"recommends":260,"isBookmarked":false,"tags":[{"slug":"material-design","name":"Material Design","postCount":3667,"metadata":{"postCount":3667,"coverImage":{"id":"1*kdOha7Em-JqNsZg0LEqhng.jpeg","originalWidth":736,"originalHeight":1104}},"type":"Tag"},{"slug":"flutter","name":"Flutter","postCount":47311,"metadata":{"postCount":47311,"coverImage":{"id":"1*t9RLfJH_3ItvRfp9zcK0Sw.png","originalWidth":2560,"originalHeight":1280,"isFeatured":true}},"type":"Tag"}],"socialRecommendsCount":0,"responsesCreatedCount":1,"links":{"entries":[{"url":"https://events.google.com/io/","alts":[],"httpStatus":200},{"url":"http://flutter.io","alts":[],"httpStatus":200},{"url":"https://codelabs.developers.google.com/codelabs/mdc-102-flutter/","alts":[],"httpStatus":200},{"url":"https://codelabs.developers.google.com/codelabs/mdc-101-flutter/","alts":[],"httpStatus":200},{"url":"https://codelabs.developers.google.com/codelabs/mdc-103-flutter/","alts":[],"httpStatus":200},{"url":"https://codelabs.developers.google.com/codelabs/mdc-104-flutter/","alts":[],"httpStatus":200},{"url":"https://medium.com/flutter-io/flutter-beta-3-7d88125245dc","alts":[{"type":2,"url":"medium://p/7d88125245dc"},{"type":3,"url":"medium://p/7d88125245dc"}],"httpStatus":200},{"url":"https://design.google/library/making-more-with-material/","alts":[],"httpStatus":200},{"url":"https://play.google.com/store/apps/details?id=io.flutter.demo.gallery","alts":[],"httpStatus":200},{"url":"https://github.com/material-components/material-components/blob/develop/ROADMAP.md","alts":[],"httpStatus":200},{"url":"https://material.io/design/material-theming/","alts":[],"httpStatus":200},{"url":"http://material.io/develop/flutter","alts":[],"httpStatus":200}],"version":"0.3","generatedAt":1525979493633},"isLockedPreviewOnly":false,"metaDescription":"","totalClapCount":1558,"sectionCount":1,"readingList":0,"topics":[]},"coverless":true,"slug":"building-beautiful-flexible-user-interfaces-with-flutter-material-theming-and-official-material","translationSourcePostId":"","translationSourceCreatorId":"","isApprovedTranslation":false,"inResponseToPostId":"","inResponseToRemovedAt":0,"isTitleSynthesized":true,"allowResponses":true,"importedUrl":"","importedPublishedAt":0,"visibility":0,"uniqueSlug":"building-beautiful-flexible-user-interfaces-with-flutter-material-theming-and-official-material-13ae9279ef19","previewContent":{"bodyModel":{"paragraphs":[{"name":"ba48","type":3,"text":"Building beautiful, flexible user interfaces with Flutter, Material Theming, and official Material Components (MDC)","markups":[],"alignment":1},{"name":"4e2e","type":1,"text":"At Google I/O 2018, the Material team announced a important update to Material Design, with a strong focus on enabling mobile apps to…","markups":[{"type":3,"start":3,"end":18,"href":"https://events.google.com/io/","title":"","rel":"","anchorType":0},{"type":3,"start":38,"end":47,"href":"https://design.google/library/making-more-with-material/","title":"","rel":"","anchorType":0}],"alignment":1}],"sections":[{"startIndex":0}]},"isFullContent":false,"subtitle":"At Google I/O 2018, the Material team announced a important update to Material Design, with a strong focus on enabling mobile apps to stand…"},"license":0,"inResponseToMediaResourceId":"","canonicalUrl":"","approvedHomeCollectionId":"4da7dfd21a33","isNewsletter":false,"newsletterId":"","webCanonicalUrl":"","mediumUrl":"","migrationId":"","notifyFollowers":true,"notifyTwitter":false,"notifyFacebook":false,"responseHiddenOnParentPostAt":0,"isSeries":false,"isSubscriptionLocked":false,"seriesLastAppendedAt":0,"audioVersionDurationSec":0,"sequenceId":"","isEligibleForRevenue":false,"isBlockedFromHightower":false,"deletedAt":0,"lockedPostSource":0,"hightowerMinimumGuaranteeStartsAt":0,"hightowerMinimumGuaranteeEndsAt":0,"featureLockRequestAcceptedAt":0,"mongerRequestType":1,"layerCake":0,"socialTitle":"","socialDek":"","editorialPreviewTitle":"","editorialPreviewDek":"","curationEligibleAt":0,"isProxyPost":false,"proxyPostFaviconUrl":"","proxyPostProviderName":"","proxyPostType":0,"isSuspended":false,"isLimitedState":false,"seoTitle":"","previewContent2":{"bodyModel":{"paragraphs":[{"name":"ba48","type":3,"text":"Building beautiful, flexible user interfaces with Flutter, Material Theming, and official Material Components (MDC)","markups":[]},{"name":"4e2e","type":1,"text":"At Google I/O 2018, the Material team announced a important update to Material Design, with a strong focus on enabling mobile apps to stand out from the rest by systematically applying brand-specific design. This is Material Theming. The following study shows customized Material components, combined together to create a brand-specific…","markups":[{"type":3,"start":3,"end":18,"href":"https://events.google.com/io/","title":"","rel":"","anchorType":0},{"type":3,"start":38,"end":47,"href":"https://design.google/library/making-more-with-material/","title":"","rel":"","anchorType":0},{"type":3,"start":216,"end":232,"href":"https://material.io/design/material-theming/","title":"","rel":"","anchorType":0},{"type":3,"start":412,"end":419,"href":"http://flutter.io","title":"","rel":"","anchorType":0}]}],"sections":[{"name":"26c3","startIndex":0}]},"isFullContent":false,"subtitle":"At Google I/O 2018, the Material team announced a important update to Material Design, with a strong focus on enabling mobile apps to stand…"},"cardType":0,"isDistributionAlertDismissed":false,"isShortform":false,"shortformType":0,"responsesLocked":false,"isLockedResponse":false,"isPublishToEmail":false,"responseDistribution":0,"isMarkedPaywallOnly":false,"type":"Post"}}},"paging":{},"collection":{"id":"4da7dfd21a33","name":"Flutter","slug":"flutter","tags":["MOBILE APP DEVELOPMENT","FLUTTER","GOOGLE","IOS APP DEVELOPMENT","ANDROID APP DEVELOPMENT"],"creatorId":"2df4e577749c","description":"Flutter is Google's UI framework for crafting high-quality native interfaces on iOS, Android, web, and desktop. Flutter works with existing code, is used by developers and organizations around the world, and is free and open source. Learn more at https://flutter.dev","shortDescription":"Flutter is Google's UI framework for crafting high-quality…","image":{"imageId":"1*5-aoK8IBmXve5whBQM90GA.png","filter":"","backgroundSize":"","originalWidth":1000,"originalHeight":1000,"strategy":"resample","height":0,"width":0},"metadata":{"followerCount":57048,"activeAt":1732210323729},"virtuals":{"permissions":{"canPublish":false,"canPublishAll":false,"canRepublish":false,"canRemove":false,"canManageAll":false,"canSubmit":false,"canEditPosts":false,"canAddWriters":false,"canViewStats":false,"canSendNewsletter":false,"canViewLockedPosts":false,"canViewCloaked":false,"canEditOwnPosts":false,"canBeAssignedAuthor":false,"canEnrollInHightower":false,"canLockPostsForMediumMembers":false,"canLockOwnPostsForMediumMembers":false,"canViewNewsletterV2Stats":false,"canCreateNewsletterV3":false},"isSubscribed":false,"isEnrolledInHightower":false,"isEligibleForHightower":false,"isSubscribedToCollectionEmails":false,"isMuted":false,"canToggleEmail":false,"isWriter":false},"logo":{"imageId":"1*KvnfbD1F5CzEsU9wSmRZyA.png","filter":"","backgroundSize":"","originalWidth":538,"originalHeight":141,"strategy":"resample","height":0,"width":0},"twitterUsername":"flutterdev","collectionMastheadId":"6f4efe3cee51","sections":[{"type":2,"collectionHeaderMetadata":{"title":"Flutter","description":"Build beautiful native apps in record time","backgroundImage":{},"logoImage":{"id":"1*XrbUBnZb-Vp9jRDGqU-BXQ@2x.png","originalWidth":2000,"originalHeight":2109,"alt":"Flutter"},"alignment":2,"layout":5}},{"type":1,"postListMetadata":{"source":3,"layout":4,"number":1,"postIds":["204b7d20c45d"]}},{"type":1,"postListMetadata":{"source":1,"layout":4,"number":9,"postIds":[]}},{"type":1,"postListMetadata":{"source":1,"layout":5,"number":15,"postIds":[]}}],"tintColor":"#FF01579B","lightText":true,"favicon":{"imageId":"","filter":"","backgroundSize":"","originalWidth":0,"originalHeight":0,"strategy":"resample","height":0,"width":0},"colorPalette":{"defaultBackgroundSpectrum":{"colorPoints":[{"color":"#FF498BD1","point":0},{"color":"#FF4781C0","point":0.1},{"color":"#FF4477AF","point":0.2},{"color":"#FF416D9E","point":0.3},{"color":"#FF3D638D","point":0.4},{"color":"#FF38587C","point":0.5},{"color":"#FF324D6B","point":0.6},{"color":"#FF2C415A","point":0.7},{"color":"#FF253548","point":0.8},{"color":"#FF1C2937","point":0.9},{"color":"#FF121B25","point":1}],"backgroundColor":"#FFFFFFFF"},"tintBackgroundSpectrum":{"colorPoints":[{"color":"#FF01579B","point":0},{"color":"#FF306CA9","point":0.1},{"color":"#FF4D7FB7","point":0.2},{"color":"#FF6591C4","point":0.3},{"color":"#FF7CA3D0","point":0.4},{"color":"#FF92B4DC","point":0.5},{"color":"#FFA7C4E7","point":0.6},{"color":"#FFBCD3F1","point":0.7},{"color":"#FFD0E3FC","point":0.8},{"color":"#FFE3F2FF","point":0.9},{"color":"#FFF7FFFF","point":1}],"backgroundColor":"#FF01579B"},"highlightSpectrum":{"colorPoints":[{"color":"#FFE8F5FF","point":0},{"color":"#FFE3F3FF","point":0.1},{"color":"#FFDEF2FF","point":0.2},{"color":"#FFDAF0FF","point":0.3},{"color":"#FFD5EFFF","point":0.4},{"color":"#FFD0EDFF","point":0.5},{"color":"#FFCBECFF","point":0.6},{"color":"#FFC6EBFF","point":0.7},{"color":"#FFC1E9FF","point":0.8},{"color":"#FFBCE8FF","point":0.9},{"color":"#FFB6E6FF","point":1}],"backgroundColor":"#FFFFFFFF"},"darkBackgroundSpectrum":{"colorPoints":[{"color":"#FF63A4EB","point":0},{"color":"#FF72ACED","point":0.1},{"color":"#FF81B4EF","point":0.2},{"color":"#FF8FBCF1","point":0.3},{"color":"#FF9CC4F3","point":0.4},{"color":"#FFA9CBF5","point":0.5},{"color":"#FFB6D3F6","point":0.6},{"color":"#FFC2DAF8","point":0.7},{"color":"#FFCFE2FA","point":0.8},{"color":"#FFDAE9FC","point":0.9},{"color":"#FFE6F0FE","point":1}],"backgroundColor":"#FF000000"}},"navItems":[{"type":1,"title":"Announcements","tagSlug":"announcements","url":"https://medium.com/flutter/tagged/announcements","source":"tagSlug"},{"type":1,"title":"Performance","tagSlug":"performance","url":"https://medium.com/flutter/tagged/performance","source":"tagSlug"},{"type":1,"title":"Material Design","tagSlug":"material-design","url":"https://medium.com/flutter/tagged/material-design","source":"tagSlug"},{"type":1,"title":"Web Development","tagSlug":"web-development","url":"https://medium.com/flutter/tagged/web-development","source":"tagSlug"},{"type":3,"title":"flutter.dev","url":"https://flutter.dev/"}],"colorBehavior":2,"collectionFeatures":[25],"ampLogo":{"imageId":"","filter":"","backgroundSize":"","originalWidth":0,"originalHeight":0,"strategy":"resample","height":0,"width":0},"header":{"title":"Flutter","description":"Build beautiful native apps in record time","backgroundImage":{},"logoImage":{"id":"1*XrbUBnZb-Vp9jRDGqU-BXQ@2x.png","originalWidth":2000,"originalHeight":2109,"alt":"Flutter"},"alignment":2,"layout":5},"subscriberCount":57048,"tagline":"Flutter is an open source UI framework for crafting beautiful apps","isOptedIntoAurora":false,"isCurationAllowedByDefault":false,"polarisCoverImage":{"imageId":"","filter":"","backgroundSize":"","originalWidth":0,"originalHeight":0,"strategy":"resample","height":0,"width":0},"ptsQualifiedAt":1616092847310,"type":"Collection"},"tag":{"slug":"material-design","name":"Material Design","postCount":3667,"metadata":{"postCount":3667,"coverImage":{"id":"1*kdOha7Em-JqNsZg0LEqhng.jpeg","originalWidth":736,"originalHeight":1104}},"type":"Tag"},"streamItems":[{"createdAt":1733168082531,"postPreview":{"postId":"d417a8a65564"},"randomId":"bf454264de85","itemType":"postPreview","type":"StreamItem"},{"createdAt":1733168082531,"postPreview":{"postId":"e3f3f622200b"},"randomId":"6038c1447f6b","itemType":"postPreview","type":"StreamItem"},{"createdAt":1733168082531,"postPreview":{"postId":"ce48a22611a3"},"randomId":"cbb85314f9e4","itemType":"postPreview","type":"StreamItem"},{"createdAt":1733168082531,"postPreview":{"postId":"535fbe3cd674"},"randomId":"fd4b58130695","itemType":"postPreview","type":"StreamItem"},{"createdAt":1733168082531,"postPreview":{"postId":"c0e993617118"},"randomId":"97b884427efa","itemType":"postPreview","type":"StreamItem"},{"createdAt":1733168082531,"postPreview":{"postId":"a285c6e3447d"},"randomId":"8683fedd42b1","itemType":"postPreview","type":"StreamItem"},{"createdAt":1733168082531,"postPreview":{"postId":"13ae9279ef19"},"randomId":"0718faa932e2","itemType":"postPreview","type":"StreamItem"}],"showCdcBanner":false}) // ]]></script><script>(function(){function c(){var b=a.contentDocument||a.contentWindow.document;if(b){var d=b.createElement('script');d.innerHTML="window.__CF$cv$params={r:'8ebdc181ee7e4a8f',t:'MTczMzE2ODA4My4wMDAwMDA='};var a=document.createElement('script');a.nonce='';a.src='/cdn-cgi/challenge-platform/scripts/jsd/main.js';document.getElementsByTagName('head')[0].appendChild(a);";b.getElementsByTagName('head')[0].appendChild(d)}}if(document.body){var a=document.createElement('iframe');a.height=1;a.width=1;a.style.position='absolute';a.style.top=0;a.style.left=0;a.style.border='none';a.style.visibility='hidden';document.body.appendChild(a);if('loading'!==document.readyState)c();else if(window.addEventListener)document.addEventListener('DOMContentLoaded',c);else{var e=document.onreadystatechange||function(){};document.onreadystatechange=function(b){e(b);'loading'!==document.readyState&&(document.onreadystatechange=e,c())}}}})();</script></body></html>