Chunky 3D button
Also called: 3D button, raised button, tactile button, keycap button.
A button with a solid, darker strip under it (a shadow with no blur), so it looks like a real key you can push. When pressed, it moves down and the strip disappears.
A solid, darker strip under each button (a shadow with no blur) makes it look like a key. Press one with the mouse: it sinks in.
Chunky
Say it in a prompt
Make the main buttons chunky 3D buttons: green #58CC02 with a 0 4px 0 #46A302 shadow (no blur), 14px corners, bold uppercase 15px labels with 0.06em letter-spacing. On press, move the button down 4px and remove the shadow. Seen on
- Duolingo: The green "Get started" button (#58CC02) has a solid darker green strip under it, a 4px shadow with no blur, so it looks like a physical key.
You might describe it as
- the green duolingo button that looks like you can push it in
- button with a thick darker edge under it
- buttons that look like keyboard keys
Not to be confused with
- Pressed state
A chunky 3D button is the raised look all the time; the pressed state is how any button looks while you push it.