Ridiculous Buttons

A collection of buttons compatible with the Nuxt framework. This project is a work in progress. I aim to add a large collection of unique and animated buttons that are completely free. Please consider adding attribution and a link to this repo on your website.

Clone this repo and run it locally or visit https://brendanbezuko.github.io/RidiculousButtons/

Features

• Light and dark mode: Every button will be compatible with the color-mode Nuxt module.
• Every Button will exist as a SFC: One great aspect of vue is that the components can exist as a single file (an SFC). Every button can easily be used by simply copying the SFC (clicking the button). N.b. Though these buttons are SFCs (a Vue concept), I'm not going to guarantee Vue compatibility. Instead, I recommend Nuxt.
• Easily copy the SFCs: The built-in preprocessor parses the SFCs and allows you to run the development server, pick a button, press it, and the entire SFC including HTML, SASS, and Javascript will be in your 📋 clipboard 📋 ready to go.

Philosophy 🎨

I'm not a professional designer, but I do believe everyone should participate in designs because it keeps things interesting with different perspectives. Design work is quite difficult and takes time to refine and get good designs, so expect these buttons to undergo a lot of refining as I develop this repo with better more nuanced design, features, and animations. I do care more about usability than appearance while still keeping these buttons interesting with animations.

Nuxt Minimal Starter

Look at the Nuxt documentation to learn more.

Setup

Make sure to install dependencies:

# npm
npm install

Development Server

Start the development server on http://localhost:3000:

# npm
npm run dev

Production

Build the application for production:

# npm
npm run generate

Locally preview production build:

# npm
npm run preview