Retro Shadow Buttons, a fun little library to get those old game-based text buttons on your website. Buttons.css is a small CSS library used to create animated, customizable, and retro style buttons and frames using plain HTML.
How to make use of it:
1. Load the stylesheet Buttons.css
within the doc and we’re able to go.
<link rel="stylesheet" href="buttons.css" />
2. The default font used right here is Roboto Mono, be at liberty to vary it to no matter what you want.
@import url('//fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,400;0,700;1,400&display=swap');
3. Add the CSS class retro
to the target component which serves as an online button.
<div class="retro"> Button text </div>
4. Determine the scale of the retro button.
<div class="retro rbtn-big"> Big Button Example </div> <div class="retro rbtn-small"> Small Button Example </div>
5. Use this library to create a retro frame for any internet content (like photos, videos, and so on).
<div class="retro-img"> // Add Image Here </div>
Animated Retro Button & Frame In Pure CSS, Retro Shadow Buttons Plugin/Github
See Demo And Download
Official Website(SockAndSandal): Click Here
This superior jQuery/javascript plugin is developed by SockAndSandal. For extra Advanced Usages, please go to the official website.
Be First to Comment