mirror of
https://github.com/uiverse-io/galaxy.git
synced 2025-11-28 05:00:22 +08:00
34 lines
1.2 KiB
HTML
34 lines
1.2 KiB
HTML
<button class="cssbuttons-io-button">
|
|
<svg height="24" width="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M0 0h24v24H0z" fill="none"></path><path d="M1 14.5a6.496 6.496 0 0 1 3.064-5.519 8.001 8.001 0 0 1 15.872 0 6.5 6.5 0 0 1-2.936 12L7 21c-3.356-.274-6-3.078-6-6.5zm15.848 4.487a4.5 4.5 0 0 0 2.03-8.309l-.807-.503-.12-.942a6.001 6.001 0 0 0-11.903 0l-.12.942-.805.503a4.5 4.5 0 0 0 2.029 8.309l.173.013h9.35l.173-.013zM13 12h3l-4 5-4-5h3V8h2v4z" fill="currentColor"></path></svg>
|
|
<span>Download</span>
|
|
</button>
|
|
<style>
|
|
/* From Uiverse.io by adamgiebl - Tags: icon, button */
|
|
.cssbuttons-io-button {
|
|
display: flex;
|
|
align-items: center;
|
|
font-family: inherit;
|
|
font-weight: 500;
|
|
font-size: 17px;
|
|
padding: 0.8em 1.5em 0.8em 1.2em;
|
|
color: white;
|
|
background: #ad5389;
|
|
background: linear-gradient(0deg, rgba(77,54,208,1) 0%, rgba(132,116,254,1) 100%);
|
|
border: none;
|
|
box-shadow: 0 0.7em 1.5em -0.5em #4d36d0be;
|
|
letter-spacing: 0.05em;
|
|
border-radius: 20em;
|
|
}
|
|
|
|
.cssbuttons-io-button svg {
|
|
margin-right: 8px;
|
|
}
|
|
|
|
.cssbuttons-io-button:hover {
|
|
box-shadow: 0 0.5em 1.5em -0.5em #4d36d0be;
|
|
}
|
|
|
|
.cssbuttons-io-button:active {
|
|
box-shadow: 0 0.3em 1em -0.5em #4d36d0be;
|
|
}
|
|
</style>
|