All Patterns

397. Modal with Card Options

393. Colored Checkboxes

392. SaaS for Construction Workers

390. Icon Software Landing Page

389. Text Edit Inline Input

388. Multiple Item Selection Drag & Drop

386. Skeleton Loader

382. Interactive Background Animation

379. Dropdown Filters

378. Modal Blackout with Animation

363. Better History - Back to Top on scroll

362. Slack - Side Menu Toggle

361. WhatsApp - Progress Bar Loading

360. Page Outline Menu

359. Discord - Button to Input Transition

356. MetaMap - Multi-Layout Topbar Menu

355. Jira - Feature Presentation Tooltip

354. Figma - Floating Form with Steps

353. Population Pyramid - Visualizations with live filters

362. Modal Blackout with Form & Animations

350. Netifly - Multi-layout Topbar Menu

349. HubSpot - Toggle High Contrast

359. Toggle List/Grid View

347. YouTube - Floating Progress Bar

357. Modal with Steps (No blackout)

344. MercadoLibre - Horizontal Item Slider

343. Behance - Login with Code Validation

342. Savee - Light/Dark Mode Switcher

341. Savee - Image Grid Customization

340. Asana - Zoom/Magnifier Over Image

339. Asana - Platform Onboarding Simulator

346. Toggl - Sidebar Menu Show More

345. Vertical Accordion for FAQs

336. Floating Popover on Click

343. Modal Drag & Drop to Fixed Position

334. MercadoLibre - Call to Action Trigger Effect

331. Linkedin - Search Bar Blackout

332. Apple - Drag&Drop Browser File to Desktop

330. PositivePsychology - Article User Feedback

322. Apple - Search on Menu Items

328. Apple Safari - Zoom In/Out Transition

333. Static Tooltip with Steps

325. Apple - Drag & Drop Slots

324. Visual Studio Code - Dual View Scroll Sync

329. Postman - Onboarding Tooltips

320. Discord - Sign In with Loading Tips

319. Wordpress - Delete Confirmation with Name

318. Binance - Tooltip on Features

315. Signal - PIN Reminder

314. Snapchat - Snap Camera

312. Pocket - View Switcher

312. Instagram - Animated Illustration with Menu

310. HubSpot - Checkbox Confirmation

309. Instagram - Brand Gradient

308. MercadoLibre - Hero Slider

313. Modal Blackout with Scroll

312. Google Data Studio

305. Notion - App Download Page

308. Spinners for Module Loading

307. Tooltip on Hover

306. Drag & Drop for Reordering Items

305. Button Combo for App Download

303. Background Animation

302. Theme Switcher in Side-drawer

300. Sound Bars Graph

299. Fixed Corner Popup with Steps

297. Thumbs Up/Down

295. “NEW” Badge on Menu Items

293. Collapsable Sidebar Menu

292. Vertical Icon Menu

291. Action Menu from Button

289. Floating Popover on Click

288. Vimeo - Topbar Language Switching

286. Apple - Background Animation on Scroll

285. Cloudflare - Sidebar with Scroll

284. Emergency Information Map

284. Top Tooltip on Link Hover

282. Telegram - Chat Setup Wizard

281. Ideabot - Background Animation on Mouse Movement

280. Slack - Workspace Creation Wizard

271. Slack - Collapsable Sidebars

278. Search Menu Dropdown from Input Text

277. Horizontal Card Slider with Actions

268. GIPHY - Alert on Drag & Drop

275. Popover on Hover

274. Interactive Background Animation

265. Youtube - Hidden Options Menu (Dots)

259. Squarespace - Multi-depth Sidebar Navigation

258. Squarespace - Adaptable Viewport Size

256. Modal Blackout with Steps & Forms

243. GIPHY - Trim Video Slicers

254. Notion - Side Menu Toggle

253. Youtube - Table Row Selector

240. Instagram - Horizontal Accordion

251. Progressive Layout Loader

235. Background Animation on Hover

241. Modal Blackout with Steps

231. Automatic Floating Popover with Steps

229. Top Banner for Design Changes

228. Notification Bell Status

236. Horizontal Graph with Time Ranges

226. Youtube Studio - Image Multi-zone Crop

225. Cloudflare - Multiple Graphs by Time Ranges

232. Drag & Drop to Browser

223. Apple - Stop Operation Progress

222. Cloudflare - Toggle Light/Dark Theme

220. Apple - Multi-window App

219. Apple - Adjacent Sidebar Toggle

218. Apple Keynote - Template Format Selection

222. Floating Banner on User Input

215. Stacked Action Button

214. Netflix - Information Toggle

218. Modal Blackout with Steps, Forms and Animations

211. Intercom - Vertical Icon Menu

212. Automatic Background Animation

172. PedidosYa - Search Results Recommendation

121. 2-pane Audio Navigation

169. Youtube Studio - Delete Content Forever

101. Downloading Desktop App

162. Login Value Compare

183. Apple MacOS - Full Screen Widget Customization

165. Two-step Download Flow

45. Webapp Video Loader

201. Modal Blackout with Actions

54. Apple Safari - Browser Reader Mode

199. Sidebar Emptystate

43. File Upload Status

134. Save for Reading Later

148. Search Bar Fade-out

138. Read Modes

91. Settings for Account Privacy

161. Apple - Two-Factor Validation (2FA)

175. Tab Preview on Hover State

95. Delete Confirmation with Name

189. Feature Preview on Menu

5. Website Promotional Top Banners

31. Page Blocker Edition Warning

7. sitepoint - Accessibility Adjustments

111. Magazine Subscription

181. Plan Upgrade Flow

132. Amazon - Store Tooltip Reminders

137. Product Color Selector

93. Top Secondary Banner

144. Meeting Guest Warning

114. News Swiper

130. Animated Email Page

189. Illustration (Meme) on Empty State

61. Section Dropdown

89. Bottom Page Fake-News Warning

198. Take action on Music Claims

157. Webflow - Magnifying Glass on Images

42. Browser Status Banner for Pages

164. Static Tooltip on Menu

81. MercadoLibre - Saving Favourites as Guest

115. Buffer - Hover Instructions

158. Bar Reading Status

56. Automatic Blackout Popover with Steps

203. Password Expiration on Login

179. Stylized Feature Highlighting

90. In-product Top Primary Banner

11. Apple MacOS - Split OS Screens

148. Half-page Illustration Slider

147. Linked Settings for User Permissions

145. Suscription Options

145. Communication Preferences on Sign Up Flow

149. Security Top-banner

139. Synced Hover Animations

167. Apple MacOS - 2-pane Widget Customization

8. Adobe - In-App NPS Survey

131. Free Audiobook Trial

103. Subscription Reminder

125. Product Highlights

124. Critical Changes Warning

182. Static Tooltip for Text Formatting

100. Automatic Floating Popover

83. Banner on News Page

10. Background Ads

87. Warning on Product Homepage

36. Contact Segmentation

29. About.me - Wizard Generation Profile

117. Side Status Notification

116. User Feedback on Web Content

186. Apple Safari - Browser Background Customization

171. Slack - Multi-browser Sign In

96. Encouraging Allowing Ads

32. Mailchimp - Makes me feel

122. Automatic Popover with Steps

14. App Bottom Popup

63. GitHub - Contextual Back Navigation Bar

28. Slack - Find your Workspace

116. 2-pane Automatic Slider

208. Checkbox for User Confirmation

133. Website-Browser Notification Reminder

176. Wordpress.com - Natural Inputs with Suggestions

79. Out of downloads

168. Anfibia - Natural Article Rating

190. Ask Email for Playing Video

129. PDF Show & Download

93. Welcome Screen with Background

94. Top Primary Banner

91. Bubble Status Reading

173. Share Invitation to Live Movie

25. Apple - Two-factor Auth

86. Table Column Slicer

83. Rewards Notification on Topbar

170. Figma - Fixed Form with Steps

55. Contextual Form Input Errors

99. Letterboxd - Topbar Dropdown Menu

3. Apple Safari - Search Options on Focus

118. Whereby - Pricing Step on Sign Up

202. Apple Reminders - List Widget Customization

173. Toggl - Onboarding Action Tooltip

57. IDF - Encouraging Newsletter Sign-up

98. Features on Signing-up

104. Slack - Creating & Customization Workspace

85. Bottom Popup Secondary

38. Youtube - Video Statusbar

66. Actionable Empty State

126. WeTransfer - In-front Site Terms

39. Youtube - Dismissed Bottom Popup

24. Window Maximize Options

119. PrestaShop - Site Cookie Management

196. Video Story on Website

11. Intercom - Likert in chat

23. Suscription gimmicks

159. Wix - Natural Language Form

54. Modal for Language & Region Picker

2. Youtube - Feed Filter Tabs

88. Fake-News Warning

156. Figma - Keyboard Navigated Menu

35. Do Not Leave Popup

37. Branded Illustrations for Reinforcement

84. Pandemic Warning Message on Map

172. Contextual Popup for Service Upgrade

22. Mailchimp - First Mailing Campaign

21. Apple MacOS - Advanced Color Picking

42. Modal for Tags Editing

41. Context Banner Card

47. Notion - Workspace Types

135. Stories From Network

80. Contextual Input Status

36. Scroll Required for User Confirmation

158. Automatic Tooltip Blackout (2)

46. Dribbble - Posting Graphics Online

29. General Form Errors Banner

105. Automatic Blackout Popover

112. Share on Social Networks

19. Twitter - Email Validation on Sign Up

178. OS Voice Widget with Actions

166. Confetti Explosion

50. Food Order Receipt

33. Incremental pricing

143. Platform Sign-in/up

1. Steps Guidance

117. 3-tier Pricing Comparison

34. Premium gimmicks

180. Dedicated Screen for Action Confirmation

139. Zoom Out Transition on Hover

160. Pocket - Content Highlighting

146. Intelligencer - Hamburger Menu

6. Modal Blackout with Form

4. Floating Status Banner

16. Double Account Entrance

155. Menu Search Highlighting

188. Trello - Color shapes for Colour-blind