component
NR — Button
By JUDE
Details
- JUDEAuthor
- componentType
- 2026-06-29Published
- 2026-08-11Updated
- 2026-06-29Added
- ButtonsCategories
Summary
Five semantic variants, 0 radius
Description
NeoRetro Button A flat, editorial button for designers who want structure without the usual borders and shadows. Built natively in Framer with zero border-radius — sharp, deliberate, and unmistakably neo-retro. Five semantic variants Primary — coral fill for main actions Dark — ink fill for high-contrast emphasis Outline — hairline border, minimal weight Outline-Red — coral border for secondary actions Outline-Navy — navy border for muted, editorial pairings Interaction states Hover drops to 0.75 opacity for a quiet, considered response Pressed adds a 1px coral border (navy on Outline-Red) Focus is handled natively through Framer's Link, so keyboard and accessibility behavior stays browser-default Design tokens Paper #F6F2EB · Ink #0C0C0B · Hairline #D4CFC6 Coral / Primary #E8604A · Navy #1A0E48 Label set in DM Sans 500 (Medium) at 13px — the Neo-Retro body style Part of the Neo-Retro design system — a modern editorial direction built on 1px rule lines and whitespace instead of heavy borders or drop shadows. Drop it into any project, swap the variant from the properties panel, and ship. Part of the JUDE Neo-Retro system. Free to use. See the full set, including the paid components: https://judestudiokorea.gumroad.com/?utm_source=framer&utm_medium=free-component&utm_campaign=nr-button — Designed by JUDE
Introduction
Five semantic variants, 0 radius
Rank history
Daily rank per list, from the first snapshot — lower is better.
- All · #3889