<!DOCTYPE html>
< html lang = "en" >
< head >
< meta charset = "utf-8" >
< title > Flutter samples< / title >
< link href = "styles.css" rel = "stylesheet" media = "screen" >
< link href = "https://fonts.googleapis.com/css?family=Google+Sans|Google+Sans+Display|Roboto:300,400,500&display=swap" rel = "stylesheet" >
< link href = "https://fonts.googleapis.com/icon?family=Material+Icons" rel = "stylesheet" >
< meta name = "viewport" content = "width=device-width, initial-scale=1" >
< script src = "packages/mdc_web/material-components-web.min.js" > < / script >
< script src = "https://kit.fontawesome.com/16cc04762e.js" > < / script >
< script defer src = "description.dart.js" > < / script >
< script async src = "https://www.googletagmanager.com/gtag/js?id=UA-67589403-8" > < / script >
< script >
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-67589403-8');
< / script >
< / head >
< body >
< div class = "content" >
< div class = "navbar" >
< a class = "leading" href = "./" >
< img src = "images/logos/logo_lockup_flutter_horizontal_wht_96.png" / >
< span class = "title" > Samples< / span >
< / a >
< div class = "nav-items" >
< a href = "https://flutter.dev/" > Flutter Home< / a >
< a href = "https://api.flutter.dev/" > API Docs< / a >
< / div >
< / div >
< div class = "container" >
< div class = "description-title-row" >
< h1 > Material 3< / h1 >
< div class = "type-label type-label-bordered" > demo< / div >
< / div >
< p > By Flutter< / p >
< div class = "toolbar" >
< div class = "buttons" >
< button class = "mdc-button mdc-button--outlined" onclick = "window.location.href = 'web/material_3_demo';" > < span class = "mdc-button__ripple" > < / span > Launch App< / button > < button class = "mdc-button mdc-button--outlined" onclick = "window.location.href = 'https://github.com/flutter/samples/tree/main/material_3_demo';" >
< div class = "mdc-button__ripple" > < / div >
< i class = "material-icons mdc-button__icon" aria-hidden = "true" > code< / i >
< span class = "mdc-button__label" > Source Code< / span >
< / button >
< / div >
< div class = "tags-container" >
< div class = "tags-label" >
< i class = "material-icons" > local_offer< / i >
< span > Tags< / span >
< / div >
< div class = "tags" >
< a href = "./#?search=tag%3Amaterial" > material< / a >
< a href = "./#?search=tag%3Adesign" > design< / a >
< / div >
< / div >
< / div >
< div class = "slider-container" >
< div class = "slider-content" >
< div class = "slider-single" > < img class = "slider-single-image" src = "images/material_3_components.png" alt = "Components tab of the Material 3 demo" / > < / div >
< div class = "slider-single" > < img class = "slider-single-image" src = "images/material_3_color.png" alt = "Colors tab of the Material 3 demo" / > < / div >
< div class = "slider-single" > < img class = "slider-single-image" src = "images/material_3_typography.png" alt = "Typography tab of the Material 3 demo" / > < / div >
< div class = "slider-single" > < img class = "slider-single-image" src = "images/material_3_elevation.png" alt = "Elevation tab of the Material 3 demo" / > < / div >
< div class = "slider-single" > < img class = "slider-single-image" src = "images/material_3_green.png" alt = "Elevation tab of the Material 3 demo with seed color of green" / > < / div >
< / div >
< / div >
< div class = "description" >
< p > Showcases Material 3 features in the Flutter Material library. These features include updated components, typography, color system and elevation support.
< / p >
< / div >
< / div >
< / div >
< / body >
< div class = "footer" >
< span > © Flutter 2023< / span >
< / div >
< / html >
