mirror of
https://github.com/uiverse-io/galaxy.git
synced 2025-11-28 05:00:22 +08:00
42 lines
1.2 KiB
HTML
42 lines
1.2 KiB
HTML
<button>Don't Click</button>
|
|
<style>
|
|
/* From Uiverse.io by Bastimans - Tags: button */
|
|
button {
|
|
background-color: #ffc600;
|
|
/* sets the background color of the button to yellow */
|
|
color: #000000;
|
|
/* sets the text color of the button to black */
|
|
padding: 12px 24px;
|
|
/* adds some padding to the button */
|
|
border: none;
|
|
/* remove the default border */
|
|
border-radius: 30px;
|
|
/* rounds the corners of the button */
|
|
font-size: 18px;
|
|
/* sets the font size of the button text */
|
|
font-weight: bold;
|
|
/* sets the font weight of the button text to bold */
|
|
cursor: pointer;
|
|
/* changes the cursor to a pointer when hovering over the button */
|
|
text-shadow: 2px 2px 3px #ffc600;
|
|
/* adds a subtle shadow to the button text */
|
|
box-shadow: 2px 2px 3px #ffc600;
|
|
/* adds a subtle shadow to the button */
|
|
transition: all 0.2s ease-in-out;
|
|
/* adds transition effect when hovering over the button */
|
|
}
|
|
|
|
button:hover {
|
|
background-color: #000000;
|
|
/* changes the background color of the button to black when hovered */
|
|
color: #ffc600;
|
|
/* changes the text color of the button to yellow when hovered */
|
|
transform: scale(1.1);
|
|
/* increases the size of the button slightly when hovered */
|
|
}
|
|
|
|
button:active {
|
|
transform: scale(0.97);
|
|
}
|
|
|
|
</style>
|