compose-preview Material 3 Design Kit

Tabs

9 of 50 components implemented · Open in Figma

Double-click a section to zoom · ⌘/Ctrl-scroll · drag to pan · + / − / 0 by keyboard · Esc resets
Configuration=Fixed, Style=Secondary, Layout=Label & icon — catalog/src/main/kotlin/ee/schimke/m3catalog/sections/Tabs.kt#SecondaryTabs Configuration=Scrollable, Style=Secondary, Layout=Label & icon — catalog/src/main/kotlin/ee/schimke/m3catalog/sections/Tabs.kt#SecondaryScrollableTabs Configuration=Fixed, Style=Secondary, Layout=Label only — catalog/src/main/kotlin/ee/schimke/m3catalog/sections/Tabs.kt#SecondaryTabs Configuration=Scrollable, Style=Secondary, Layout=Label only — catalog/src/main/kotlin/ee/schimke/m3catalog/sections/Tabs.kt#SecondaryScrollableTabs Configuration=Fixed, Style=Primary, Layout=Icon only — catalog/src/main/kotlin/ee/schimke/m3catalog/sections/Tabs.kt#PrimaryTabs Configuration=Scrollable, Style=Primary, Layout=Icon only — no code behind this Configuration=Fixed, Style=Primary, Layout=Label & icon — catalog/src/main/kotlin/ee/schimke/m3catalog/sections/Tabs.kt#PrimaryTabs Configuration=Scrollable, Style=Primary, Layout=Label & icon — catalog/src/main/kotlin/ee/schimke/m3catalog/sections/Tabs.kt#PrimaryScrollableTabs Configuration=Fixed, Style=Primary, Layout=Label only — catalog/src/main/kotlin/ee/schimke/m3catalog/sections/Tabs.kt#PrimaryTabs Configuration=Scrollable, Style=Primary, Layout=Label only — catalog/src/main/kotlin/ee/schimke/m3catalog/sections/Tabs.kt#PrimaryScrollableTabs Selected=True, State=Pressed — no code behind this Selected=True, State=Focused — no code behind this Selected=True, State=Hovered — no code behind this Selected=True, State=Enabled — no code behind this Selected=False, State=Pressed — no code behind this Selected=False, State=Focused — no code behind this Selected=False, State=Hovered — no code behind this Selected=False, State=Enabled — no code behind this Selected=True, State=Pressed — no code behind this Selected=True, State=Focused — no code behind this Selected=True, State=Hovered — no code behind this Selected=True, State=Enabled — no code behind this Selected=False, State=Pressed — no code behind this Selected=False, State=Focused — no code behind this Selected=False, State=Hovered — no code behind this Selected=False, State=Enabled — no code behind this Selected=True, State=Pressed — no code behind this Selected=True, State=Focused — no code behind this Selected=True, State=Hovered — no code behind this Selected=True, State=Enabled — no code behind this Selected=False, State=Pressed — no code behind this Selected=False, State=Focused — no code behind this Selected=False, State=Hovered — no code behind this Selected=False, State=Enabled — no code behind this Selected=True, State=Pressed — no code behind this Selected=True, State=Focused — no code behind this Selected=True, State=Hovered — no code behind this Selected=True, State=Enabled — no code behind this Selected=False, State=Pressed — no code behind this Selected=False, State=Focused — no code behind this Selected=False, State=Hovered — no code behind this Selected=False, State=Enabled — no code behind this Selected=True, State=Pressed — no code behind this Selected=True, State=Focused — no code behind this Selected=True, State=Hovered — no code behind this Selected=True, State=Enabled — no code behind this Selected=False, State=Pressed — no code behind this Selected=False, State=Focused — no code behind this Selected=False, State=Hovered — no code behind this Selected=False, State=Enabled — no code behind this
9 of 50 components implemented
Configuration=Fixed, Style=Secondary, Layout=Label & iconcatalog/src/main/kotlin/ee/schimke/m3catalog/sections/Tabs.kt#SecondaryTabs Configuration=Scrollable, Style=Secondary, Layout=Label & iconcatalog/src/main/kotlin/ee/schimke/m3catalog/sections/Tabs.kt#SecondaryScrollableTabs Configuration=Fixed, Style=Secondary, Layout=Label onlycatalog/src/main/kotlin/ee/schimke/m3catalog/sections/Tabs.kt#SecondaryTabs Configuration=Scrollable, Style=Secondary, Layout=Label onlycatalog/src/main/kotlin/ee/schimke/m3catalog/sections/Tabs.kt#SecondaryScrollableTabs Configuration=Fixed, Style=Primary, Layout=Icon onlycatalog/src/main/kotlin/ee/schimke/m3catalog/sections/Tabs.kt#PrimaryTabs Configuration=Scrollable, Style=Primary, Layout=Icon onlyno code behind this Configuration=Fixed, Style=Primary, Layout=Label & iconcatalog/src/main/kotlin/ee/schimke/m3catalog/sections/Tabs.kt#PrimaryTabs Configuration=Scrollable, Style=Primary, Layout=Label & iconcatalog/src/main/kotlin/ee/schimke/m3catalog/sections/Tabs.kt#PrimaryScrollableTabs Configuration=Fixed, Style=Primary, Layout=Label onlycatalog/src/main/kotlin/ee/schimke/m3catalog/sections/Tabs.kt#PrimaryTabs Configuration=Scrollable, Style=Primary, Layout=Label onlycatalog/src/main/kotlin/ee/schimke/m3catalog/sections/Tabs.kt#PrimaryScrollableTabs Selected=True, State=Pressedno code behind this Selected=True, State=Focusedno code behind this Selected=True, State=Hoveredno code behind this Selected=True, State=Enabledno code behind this Selected=False, State=Pressedno code behind this Selected=False, State=Focusedno code behind this Selected=False, State=Hoveredno code behind this Selected=False, State=Enabledno code behind this Selected=True, State=Pressedno code behind this Selected=True, State=Focusedno code behind this Selected=True, State=Hoveredno code behind this Selected=True, State=Enabledno code behind this Selected=False, State=Pressedno code behind this Selected=False, State=Focusedno code behind this Selected=False, State=Hoveredno code behind this Selected=False, State=Enabledno code behind this Selected=True, State=Pressedno code behind this Selected=True, State=Focusedno code behind this Selected=True, State=Hoveredno code behind this Selected=True, State=Enabledno code behind this Selected=False, State=Pressedno code behind this Selected=False, State=Focusedno code behind this Selected=False, State=Hoveredno code behind this Selected=False, State=Enabledno code behind this Selected=True, State=Pressedno code behind this Selected=True, State=Focusedno code behind this Selected=True, State=Hoveredno code behind this Selected=True, State=Enabledno code behind this Selected=False, State=Pressedno code behind this Selected=False, State=Focusedno code behind this Selected=False, State=Hoveredno code behind this Selected=False, State=Enabledno code behind this Selected=True, State=Pressedno code behind this Selected=True, State=Focusedno code behind this Selected=True, State=Hoveredno code behind this Selected=True, State=Enabledno code behind this Selected=False, State=Pressedno code behind this Selected=False, State=Focusedno code behind this Selected=False, State=Hoveredno code behind this Selected=False, State=Enabledno code behind this