Skip to content

Instantly share code, notes, and snippets.

@pa-ulander

pa-ulander/index.html

Last active February 9, 2022 15:14
Show Gist options
  • Save pa-ulander/9970be6b33f26bddac40d484400626fb to your computer and use it in GitHub Desktop.
Save pa-ulander/9970be6b33f26bddac40d484400626fb to your computer and use it in GitHub Desktop.
Download ZIP
input type date with calendar icon. preview here: https://codepen.io/pa-ulander/pen/xxPqmYN
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<style>
input[type="date"]::-webkit-inner-spin-button {
opacity: 0
}
input[type="date"]::-webkit-calendar-picker-indicator {
background: url(https://cdn3.iconfinder.com/data/icons/linecons-free-vector-icons-pack/32/calendar-16.png) center/80% no-repeat;
color: rgba(0, 0, 0, 0);
opacity: 0.5
}
input[type="date"]::-webkit-calendar-picker-indicator:hover {
background: url(https://cdn3.iconfinder.com/data/icons/linecons-free-vector-icons-pack/32/calendar-16.png) center/80% no-repeat;
opacity: 0.8
}
</style>
<input type="date">
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment