Button by mrhyddenn

Made by

@mrhyddenn

Theme:

Dark

#button

#212121

11K views

CSSAdd prefixes

1button {
2  background: none;
3  border: none;
4  padding: 15px 15px;
5  border-radius: 10px;
6}
7
8button:hover {
9  background: rgba(170, 170, 170, 0.062);
10  transition: 0.5s;
11}
12
13button svg {
14  color: #fff;
15}

button {
  background: none;
  border: none;
  padding: 15px 15px;
  border-radius: 10px;
}

button:hover {
  background: rgba(170, 170, 170, 0.062);
  transition: 0.5s;
}

button svg {
  color: #fff;
}

HTML

1<button>
2    <svg height="24" width="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
3        <path d="M0 0h24v24H0z" fill="none"></path>
4        <path d="M20 17h2v2H2v-2h2v-7a8 8 0 1 1 16 0v7zm-2 0v-7a6 6 0 1 0-12 0v7h12zm-9 4h6v2H9v-2z" fill="currentColor"></path>
5    </svg>
6</button>

<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="M20 17h2v2H2v-2h2v-7a8 8 0 1 1 16 0v7zm-2 0v-7a6 6 0 1 0-12 0v7h12zm-9 4h6v2H9v-2z" fill="currentColor"></path>
    </svg>
</button>