uber

UI Kit 113 components

Button 8

Primary / Large398 × 56Secondary / Pill117 × 36Secondary / Icon115 × 36Secondary / Large126 × 48Tertiary / Default81 × 36Icon / Circle36 × 36Icon / Floating48 × 48Secondary / Full398 × 56

Chip 7

Filter / Selected61 × 36Filter / Default95 × 36FilterIcon / Selected129 × 36FilterIcon / Default100 × 36Dropdown / Inverse268 × 36Dropdown / Default144 × 36Shortcut / Default142 × 34

Badge 3

Promo / Small49 × 20Promo / Default52 × 24Rating / Default52 × 20

Tag 1

Info / Default96 × 20

Indicator 3

Dot / Red8 × 8Dot / Blue8 × 8Grabber / Default48 × 4

Radio 2

Selection / Off17 × 17Selection / On17 × 17

Avatar 4

Placeholder / 8080 × 80Placeholder / 6464 × 64Photo / 6464 × 64Photo / 2828 × 28

Map 1

Pin / Destination30 × 47

Input 8

Search / Destination398 × 48Search / Promo398 × 48Route / Default346 × 76Search / Home397 × 58Text / Default398 × 74Text / Focused398 × 74Phone / Default398 × 56OTP / Digit56 × 56

Header 11

Nav / Close430 × 48Nav / Back430 × 48Sheet / Back430 × 48LargeTitle / Default430 × 40LargeTitle / Large430 × 44Section / Action430 × 36Section / Default430 × 32Section / Link430 × 24Location / Default430 × 24Profile / Default430 × 72Account / Centered430 × 150

Sheet 2

Header / Title430 × 64Header / Grabber430 × 84

Tooltip 1

Dark / Default274 × 73

Navigation 4

TabItem / Active72 × 45TabItem / Default72 × 45TabBar / Floating344 × 61Tabs / Underline430 × 50

List 15

Stop / Pickup430 × 66Stop / Dropoff430 × 66Row / Action430 × 69Row / Navigation430 × 86Row / Status430 × 86Row / Simple430 × 56Row / Payment430 × 56Row / Profile430 × 64Row / ProfileLink430 × 76Place / Recent430 × 68Option / Radio430 × 80Option / Avatar430 × 64Feature / Default430 × 65Trip / Compact430 × 96Notification / Offer430 × 140

Card 13

Trip / Featured398 × 308Service / Circle94 × 126Service / Tile91 × 102Promo / Image296 × 180Banner / Safety398 × 159Wallet / Balance398 × 140Recommendation / Outlined398 × 248Action / Tile195 × 60Promo / Gray398 × 95Progress / Gray398 × 107Shortcut / Tile127 × 100Payment / Preview398 × 136Trip / Featured / EN398 × 308

Swatch 29

text / primary150 × 160text / secondary150 × 160text / tertiary150 × 160text / inverse150 × 160text / link150 × 160text / tag150 × 160surface / primary150 × 160surface / secondary150 × 160surface / inverse150 × 160surface / tooltip150 × 160surface / avatar150 × 160border / default150 × 160border / strong150 × 160border / track150 × 160icon / chevron150 × 160icon / radio150 × 160accent / blue150 × 160accent / blue-bright150 × 160accent / blue-tint150 × 160accent / blue-soft150 × 160accent / blue-ring150 × 160accent / red150 × 160accent / red-dot150 × 160accent / red-tint150 × 160accent / green150 × 160accent / green-tint150 × 160scrim150 × 160icon / chevron-strong150 × 160border / input150 × 160

Divider 1

Text / Or398 × 20