Border-radius Previewer

Preview how CSS3 border-radius values affect an element

About this Project

The idea for this project came from the florinpop17 repository.

There are 80 ideas for better web development.

Why?

This project is part of my personal portfolio and I would be very happy to receive feedback about the project, code, structure, anything that can make me a better developer!

E-mail: tthheusalmeida@gmail.com
LinkedIn: matheus-almeida-602139182

Also, you can use this project however you want, it is free to copy, change, improve ...

Functionality

• After placing the values in the fields listed and pressing the "Try" button, it creates the preview of the border-radius.
• To receive the border-radius values, press the "Copy" button and you will be ready for the clipboard.

How to use?

• Clone this repository to your local machine using https://github.com/tthheusalmeida/border-radius.git
• Unzip the cloned file
• Open the border-radius-master folder
• Double click on the index.html file
• Enter the values corresponding to the border-radius fields
• Press Try button to preview border-radius
• Press Copy button to copy to clipboard

Note

• Border-radius values are copied in %, such as: border-radius: 0% 50% 0% 50%
• The minimum value that each element can assume is 0%
• The maximum value that each element can assume is 50%

Built With

• HTML - Markup for page
• CSS - Style for page
• JavaScript - Manipulation of page features

License

• MIT