Ink Sharp CSS Button
Square
28 free examples · MIT licensed
Square CSS Buttons
Square buttons keep their corners sharp to feel deliberate, technical or nostalgic depending on the styling around them. The collection ranges from brutalist blocks to pixel-era controls, all in plain CSS.
Brutalist layoutsRetro projectsEditorial design
Live examples
Copy a square button
Underline Slide CSS Button
Square· Slide
Bracket Hint CSS Button
Square· Icon FX
Corner Frame CSS Button
Square· Border FX
Laser Line CSS Button
Square· Border FX
Brutal Pink CSS Button
Square
Windows 95 CSS Button
Square
Vaporwave CSS Button
Square
8-Bit CSS Button
Square
Newsprint CSS Button
Square
Border Draw CSS Button
Square· Border FX
Breathing Line CSS Button
Square· Animated· Border FX
Wild West CSS Button
Square
Wave Line CSS Button
Square· Animated· Border FX
Quiet Type CSS Button
Square
Hairline CSS Button
Square· Hover Reveal
Mono Caps CSS Button
Square· Text FX
Under Score CSS Button
Square· Hover Reveal· Border FX
Framed Air CSS Button
Square· Text FX
Raw Block CSS Button
Square
Offset Punch CSS Button
Square
Concrete Slab CSS Button
Square· Text FX
Anti Design CSS Button
Square
Stamp Crooked CSS Button
Square
Mono Brutal CSS Button
Square· Text FX
Strike Reveal CSS Button
Square· Text FX· Hover Reveal
Echo Shadow CSS Button
Square· Text FX
How to use this collection
Open any example to test its label, size and color against multiple backgrounds. Copy the self-contained CSS when the interaction feels right, then use the matching UI section to find components with compatible contrast, depth and motion.