# Widget catalog

> A catalog of some of Flutter's rich set of widgets.



Create beautiful apps faster with Flutter's collection of visual, structural,
platform, and interactive widgets. In addition to browsing widgets by category,
you can also see all the widgets in the [widget index][].

## Design systems

Flutter ships with two design systems as part of the SDK.

<div class="card-grid">
  <Card title="Cupertino" link="/ui/widgets/cupertino" outlined="true" filled="false">
    Beautiful and high-fidelity widgets that align with
    Apple's Human Interface Guidelines for iOS and macOS.
  </Card>
  <Card title="Material design" link="/ui/widgets/material" outlined="true" filled="false">
    Visual, behavioral, and motion-rich widgets implementing
    the Material 3 design specification.
  </Card>
</div>

You can find many more design systems created by the Flutter community
on [pub.dev](https://pub.dev), the package repository for Dart and Flutter.
For example, the Windows-inspired [fluent_ui][],
macOS-inspired [macos_ui][],
and the Ubuntu-inspired [yaru][] widgets.

[fluent_ui]: https://pub.dev/packages/fluent_ui
[macos_ui]: https://pub.dev/packages/macos_ui
[yaru]: https://pub.dev/packages/yaru

## Base widgets

Base widgets support a range of common rendering options
like input, layout, and text.

<WidgetCatalogCategories />

## Widget of the Week

100+ short, 1-minute explainer videos to
help you quickly get started with Flutter widgets.

<div class="card-grid wide">
  <div class="card wrapped-card outlined-card">
    <div class="card-content">
      <YouTubeEmbed id="D0xwcz2IqAY" title="CupertinoRadio - Flutter widget of the week"></YouTubeEmbed>
    </div>
  </div>
  <div class="card wrapped-card outlined-card">
    <div class="card-content">
      <YouTubeEmbed id="5H-WvH5O29I" title="CupertinoSheetRoute - Flutter widget of the week"></YouTubeEmbed>
    </div>
  </div>
  <div class="card wrapped-card outlined-card">
    <div class="card-content">
      <YouTubeEmbed id="esnBf6V4C34" title="CupertinoSlidingSegmentedControl - Flutter widget of the week"></YouTubeEmbed>
    </div>
  </div>
  <div class="card wrapped-card outlined-card">
    <div class="card-content">
      <YouTubeEmbed id="ua54JU7k1Us" title="CupertinoCheckbox - Flutter widget of the week"></YouTubeEmbed>
    </div>
  </div>
  <div class="card wrapped-card outlined-card">
    <div class="card-content">
      <YouTubeEmbed id="24tg_N4sdMQ" title="CupertinoSwitch - Flutter widget of the week"></YouTubeEmbed>
    </div>
  </div>
  <div class="card wrapped-card outlined-card">
    <div class="card-content">
      <YouTubeEmbed id="GQ8ajYVF0bo" title="CarouselView - Flutter widget of the week"></YouTubeEmbed>
    </div>
  </div>
</div>

<a class="filled-button" target="_blank" href="https://www.youtube.com/playlist?list=PLjxrf2q8roU23XGwz3Km7sQZFTdB996iG">Watch more widget of the week videos</a>

[widget index]: /reference/widgets

