Home
/
Explore
Here is the collection of 91 patterns
All covers you see in this page are made with CSS only. Inspect them! 🎉
Layout
Card layout
Holy grail
Same height columns
Sidebar
Simple grid
Split screen
Sticky footer
Sticky header
Sticky sections
Navigation
/
/
Breadcrumb
Circular navigation
Dot navigation
Drawer
Dropdown
Full screen menu
Mega menu
Menu
Nested dropdowns
Pagination
<
>
Previous next buttons
Split navigation
Tab
1
2
3
Wizard
Input
Button with icon
Chip
Custom checkbox button
Custom radio button
Floating label
Input addon
Radio button group
Radio switch
★
★
★
☆
☆
Rating
Search box
Slider
Spin button
-
+
Stepper input
Switch
Toggle password visibility
Upload button
Display
Accordion
Arrow buttons
Avatar
1
2
3
Avatar list
1
Badge
Card
Centering
Close button
Cookie banner
Corner ribbon
Curved background
Diagonal section
Docked at corner
Dot leader
Drop area
Drop cap
Fading long section
Feature comparison
Feature list
Fixed at corner
Fixed at side
Full background
PN
Initial avatar
⌘ + C
Keyboard shortcut
Lined paper
Media object
Overlay play button
Pricing table
Property list
Questions and answers
Ribbon
Separator
Stacked cards
Stamp border
1k+
stars
Statistic
Status light
Sticky table column
Sticky table headers
Teardrop
Timeline
Triangle buttons
Video background
Draft
Watermark
Feedback
×
Modal
×
Notification
Popover arrow
Progress bar
33%
Radial progress bar
Resizable element
Presence indicator
Tooltip
Validation icon
Hit the Subscribe button for the latest news on my tools. No spam. Ever!
Subscribe
Products
1 LOC
new
favorite JavaScript utilities in single line of code
Blur Page
a browser extension to hide sensitive element on page
Check Browsers Support
a browser extension to check browser compatibility without leaving your tab
CSS Layout
a collection of popular layouts and patterns made with CSS
Fake Numbers
a JavaScript library to fake a number
Form Validation
the best validation library for JavaScript
HTML DOM
common tasks of managing HTML DOM with vanilla JavaScript
React PDF Viewer
a PDF viewer made for React
this VS that
the differences between ___ and ___ in the front-end development
Follow me
I love building products!
Twitter
@nghuuphuoc
dev.to
@phuocng
GitHub
@phuoc-ng
© 2020 Nguyen Huu Phuoc. All rights reserved