mirror of
https://github.com/uiverse-io/galaxy.git
synced 2025-11-28 05:00:22 +08:00
53 lines
No EOL
1.1 KiB
HTML
53 lines
No EOL
1.1 KiB
HTML
<button class="btn btn-primary">
|
|
<span class="btn-txt">Get started</span>
|
|
<kbd class="btn-kbd">G</kbd>
|
|
</button>
|
|
|
|
<style>
|
|
/* From Uiverse.io by SelfMadeSystem - Tags: simple, neumorphism, animation, blue, minimalist, button */
|
|
.btn {
|
|
margin: 0.5rem;
|
|
padding: 0.5rem 0.75rem;
|
|
border-radius: 0.5rem;
|
|
border: none;
|
|
font-weight: 600;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.btn kbd {
|
|
margin: 0.25rem;
|
|
padding: 0.125rem 0.5rem;
|
|
border-radius: 0.25rem;
|
|
}
|
|
|
|
.btn-primary {
|
|
background: linear-gradient(#1f5afe, #0f4cf5);
|
|
color: white;
|
|
box-shadow: inset 0pt 4pt 3pt -2pt #386fff, 0pt 4pt 5pt -3pt #0009;
|
|
border-bottom: 2pt solid #083acd;
|
|
transition: all 0.5s ease;
|
|
}
|
|
|
|
.btn-primary:hover {
|
|
border-bottom: 4pt solid #083acd;
|
|
translate: 0pt -1pt;
|
|
}
|
|
|
|
.btn-primary:active {
|
|
box-shadow: inset 0pt 4pt 3pt -2pt #386fff, 0pt 4pt 5pt -3pt #0000;
|
|
border-bottom: 1pt solid #083acd;
|
|
translate: 0pt 0pt;
|
|
}
|
|
|
|
.btn-primary kbd {
|
|
background-color: #3e6eff;
|
|
box-shadow: inset 0pt -3pt 3pt -2pt #1f54f0, inset 0pt 3pt 3pt -2pt #658dff,
|
|
0pt 2pt 2pt -2pt #0005, 0pt 0pt 0pt 2pt #0d47f0;
|
|
}
|
|
|
|
.btn-base {
|
|
background: #386fff;
|
|
}
|
|
|
|
</style>
|
|
|