File
Login or Register via GitHub
<html><head><meta name="description" content="Fitbit LCD Clock"> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>JS Bin</title></head><body> <svg id="page" class="portrait-view"> <!- <image id="background" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAVwAAAD6CAIAAABiRmg8AAAAK3RFWHRDcmVhdGlvbiBUaW1lAFN1biAzIFNlcCAyMDE3IDIxOjIwOjIyIC0wMDAw2RqqTAAAAAd0SU1FB+EJAxUECpA94pkAAAAJcEhZcwAACxEAAAsRAX9kX5EAAAAEZ0FNQQAAsY8L/GEFAAAEeUlEQVR42u3cPUtcaxiG0RO1iNMLKYVgYR0Qf7N/yGIIWAbEdkwRNa9mZ5sriUWKk/dwXKvyo7mneC5mj+Cbh4eHfwC+25s9APhvOXjpF/f399vt9urJbre7vb29vLy8vr6ePRj4Y0dHR6enp4eHh5vN5vjJycnJ3t4L7wkefnFxcXF2dra/vz/7hQD/lnHg48zHsf9agETh5ubm/Px89lrg7xknPw7/xSgoArxC4/B/H4XxRmL2NmCOH58jnqMwHjBmDwPmGOf/cxTu7u58sgiv1jj/EYFvNVj+JrHdbsePZg8D5hjnPyLw7eslCldXV7NXATOtERAF4NHPUdjtdrMnATOtEVii8Pnz59mTgJnWCCxR+Pjx4+xJwExrBJYofPr0afYkYKY1AksUvnz5MnsSMNMaAf9PAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAYglCgcHB7OXADOtEVii8O7du9mTgJnWCCxReP/+/exJwExrBJYovH37dvYkYKY1AksUNpvN7EnATGsEligcHx/PngTMtEZAFIBHzxF4eHJ3d7e/vz97FTDHOP8RgW81WN4p7O3tffjwYfYwYI5x/iMCyzcP311cXMweBswxzn9NwXMUhvPz89nbgL9tHP6PHUgUbm5udAFelXHy4/BfjML6HHF2duZzR/gfGwc+zvzHp4bVm8cw/M79/f12u716stvtbm9vLy8vr6+vZ78W4I8dHR2dnp4eHh5uNpvjJycnJ8+fLNaLUQBeJ/9PAYivKSqWeGAPjrwAAAAASUVORK5CYII=" x="0" y="0" width="100%" height="100%" fill="#000000" class="background" /> -> <rect x="0" y="0" width="100%" height="100%" fill="black"/> <image id="day" x="192" y="75" width="68" height="30" fill="#FFFFFF" class="foreground" /> <image id="date1" x="292" y="75" width="20" height="30" fill="#FFFFFF" class="foreground" /> <image id="date2" x="319" y="75" width="20" height="30" fill="#FFFFFF" class="foreground" /> <svg> <image href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAABHCAQAAACghN+YAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4QgODSYPmtpTkwAAACpJREFUSMdj/P+fgSBgYmAYVTSqiGqKRsEoGAWjYBRQGTCO1uajiuitCACxdwQ/SVB8ogAAAABJRU5ErkJggg==" x="166" y="137" width="18" height="71" opacity=".1" fill="#FFFFFF" class="foreground" /> <image id="separator" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAABHCAQAAACghN+YAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4QgODSYPmtpTkwAAACpJREFUSMdj/P+fgSBgYmAYVTSqiGqKRsEoGAWjYBRQGTCO1uajiuitCACxdwQ/SVB8ogAAAABJRU5ErkJggg==" x="166" y="137" width="18" height="71" fill="#FFFFFF" class="foreground" /> <image href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEUAAABtCAQAAABde2T5AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA0NKjnrYCboAAADPUlEQVRo3u3au2sUQRwH8N/YmPMR4zMxaAjBV2VtbyUiIhJUIr6IAV+FBsFmRWKtvYUIon+CgkJQETEookY8Y0BBlLNQMDbBJHf3tbjc3s5zN3czsynm14UNsx9+O7P7m/kd0XxgL2aQTzzHCuID+3LBvMBKkgP7MesZ8jIBQQE3EpgDXjFjaI/vvItQADjMQcx5grzCqgYEf2sUHtPvBfMaHUkIUKfwmEMoO4a8wWoekqTwmCNOMW+xRoTwFB4zgIojyDuslSEihcccc4IZxzoVRKbwmBPWMR+wXg1RUXjMKVQtQj5igw6ipvCYQWuYIjr1EB2FxwxZwUygywTRU3jMmZYxn7HRDDFReMy5liCT6E6DAAwFmiZd3GTD8RDLiFGzMcvm4o/eI2rX/JchK0JmWg99RtIekGWMGZKFAhQsUe6bb7OEFk0ESqAESqAESqAESqAESqA4ppSpauleM2l1uLniL6Pf2uajE8XmNx9lHLa6JevCRHOUCo7ang/oxqSeslRzAFjBcReTE5vwRbN9J8IA3ZWmL+g0ux3/0WNhpU2xqXi0Z9QrXX9YP3Pjz0+qGEqoRqycOZWwPR6xF9+Eq4/Rpj5ZOmsdImL68D1x5Qm3L8f5+MIFJxARswU/4n7QcnF6XAIAXHQGETHbUAIwpu4HXcFlpxARswMPGt0P/aJzAxEwWVa/O8jCMLjmvBtUwtZsX+ZPVHFcEfyk31nz4rY5lWhM5YvJAsEIIueYZKtuJ0Yb3SF51bjF8JBfAN5LmMTydYeRIZAwwnvEDUYNiTGsBqFISNJVdr2BoVsW6pUi7WF/6hAaJf6xjNNu/Zs1cvVKETISZ8ZU20YeIakVf+QPkt75iHxBsjRhIj8Qv/2ge4unH8TCoUagBEqgBEqgBEqgBEqg5EqpWusHldPqcHPFX8FJa5uPzbpGQ5bNh0VIOsb0w8UqDbI78TAdLcyrafavjqGn1LfQB8RlZP7Qvdn4ip70zOgoNiEZMWqKbUgmjIriApIBI1NcQVIxIsUlJAXDU1xDjJgkxQfEgGlQfEG0mDrFJ0SDqVF8Q5QYQiEXiAJDaMsJImH4T6NfiIDJF6LG5ATRZybP+A9tnJrSa1cBQQAAAABJRU5ErkJggg==" x="7" y="118" width="69" height="108" fill="#FFFFFF" opacity=".1" class="foreground" /> <image href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEUAAABtCAQAAABde2T5AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA0NKjnrYCboAAADPUlEQVRo3u3au2sUQRwH8N/YmPMR4zMxaAjBV2VtbyUiIhJUIr6IAV+FBsFmRWKtvYUIon+CgkJQETEookY8Y0BBlLNQMDbBJHf3tbjc3s5zN3czsynm14UNsx9+O7P7m/kd0XxgL2aQTzzHCuID+3LBvMBKkgP7MesZ8jIBQQE3EpgDXjFjaI/vvItQADjMQcx5grzCqgYEf2sUHtPvBfMaHUkIUKfwmEMoO4a8wWoekqTwmCNOMW+xRoTwFB4zgIojyDuslSEihcccc4IZxzoVRKbwmBPWMR+wXg1RUXjMKVQtQj5igw6ipvCYQWuYIjr1EB2FxwxZwUygywTRU3jMmZYxn7HRDDFReMy5liCT6E6DAAwFmiZd3GTD8RDLiFGzMcvm4o/eI2rX/JchK0JmWg99RtIekGWMGZKFAhQsUe6bb7OEFk0ESqAESqAESqAESqAESqA4ppSpauleM2l1uLniL6Pf2uajE8XmNx9lHLa6JevCRHOUCo7ang/oxqSeslRzAFjBcReTE5vwRbN9J8IA3ZWmL+g0ux3/0WNhpU2xqXi0Z9QrXX9YP3Pjz0+qGEqoRqycOZWwPR6xF9+Eq4/Rpj5ZOmsdImL68D1x5Qm3L8f5+MIFJxARswU/4n7QcnF6XAIAXHQGETHbUAIwpu4HXcFlpxARswMPGt0P/aJzAxEwWVa/O8jCMLjmvBtUwtZsX+ZPVHFcEfyk31nz4rY5lWhM5YvJAsEIIueYZKtuJ0Yb3SF51bjF8JBfAN5LmMTydYeRIZAwwnvEDUYNiTGsBqFISNJVdr2BoVsW6pUi7WF/6hAaJf6xjNNu/Zs1cvVKETISZ8ZU20YeIakVf+QPkt75iHxBsjRhIj8Qv/2ge4unH8TCoUagBEqgBEqgBEqgBEqg5EqpWusHldPqcHPFX8FJa5uPzbpGQ5bNh0VIOsb0w8UqDbI78TAdLcyrafavjqGn1LfQB8RlZP7Qvdn4ip70zOgoNiEZMWqKbUgmjIriApIBI1NcQVIxIsUlJAXDU1xDjJgkxQfEgGlQfEG0mDrFJ0SDqVF8Q5QYQiEXiAJDaMsJImH4T6NfiIDJF6LG5ATRZybP+A9tnJrSa1cBQQAAAABJRU5ErkJggg==" x="87" y="118" width="69" height="108" fill="#FFFFFF" opacity=".1" class="foreground" /> <image href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEUAAABtCAQAAABde2T5AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA0NKjnrYCboAAADPUlEQVRo3u3au2sUQRwH8N/YmPMR4zMxaAjBV2VtbyUiIhJUIr6IAV+FBsFmRWKtvYUIon+CgkJQETEookY8Y0BBlLNQMDbBJHf3tbjc3s5zN3czsynm14UNsx9+O7P7m/kd0XxgL2aQTzzHCuID+3LBvMBKkgP7MesZ8jIBQQE3EpgDXjFjaI/vvItQADjMQcx5grzCqgYEf2sUHtPvBfMaHUkIUKfwmEMoO4a8wWoekqTwmCNOMW+xRoTwFB4zgIojyDuslSEihcccc4IZxzoVRKbwmBPWMR+wXg1RUXjMKVQtQj5igw6ipvCYQWuYIjr1EB2FxwxZwUygywTRU3jMmZYxn7HRDDFReMy5liCT6E6DAAwFmiZd3GTD8RDLiFGzMcvm4o/eI2rX/JchK0JmWg99RtIekGWMGZKFAhQsUe6bb7OEFk0ESqAESqAESqAESqAESqA4ppSpauleM2l1uLniL6Pf2uajE8XmNx9lHLa6JevCRHOUCo7ang/oxqSeslRzAFjBcReTE5vwRbN9J8IA3ZWmL+g0ux3/0WNhpU2xqXi0Z9QrXX9YP3Pjz0+qGEqoRqycOZWwPR6xF9+Eq4/Rpj5ZOmsdImL68D1x5Qm3L8f5+MIFJxARswU/4n7QcnF6XAIAXHQGETHbUAIwpu4HXcFlpxARswMPGt0P/aJzAxEwWVa/O8jCMLjmvBtUwtZsX+ZPVHFcEfyk31nz4rY5lWhM5YvJAsEIIueYZKtuJ0Yb3SF51bjF8JBfAN5LmMTydYeRIZAwwnvEDUYNiTGsBqFISNJVdr2BoVsW6pUi7WF/6hAaJf6xjNNu/Zs1cvVKETISZ8ZU20YeIakVf+QPkt75iHxBsjRhIj8Qv/2ge4unH8TCoUagBEqgBEqgBEqgBEqg5EqpWusHldPqcHPFX8FJa5uPzbpGQ5bNh0VIOsb0w8UqDbI78TAdLcyrafavjqGn1LfQB8RlZP7Qvdn4ip70zOgoNiEZMWqKbUgmjIriApIBI1NcQVIxIsUlJAXDU1xDjJgkxQfEgGlQfEG0mDrFJ0SDqVF8Q5QYQiEXiAJDaMsJImH4T6NfiIDJF6LG5ATRZybP+A9tnJrSa1cBQQAAAABJRU5ErkJggg==" x="194" y="118" width="69" height="108" fill="#FFFFFF" opacity=".1" class="foreground" /> <image href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEUAAABtCAQAAABde2T5AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA0NKjnrYCboAAADPUlEQVRo3u3au2sUQRwH8N/YmPMR4zMxaAjBV2VtbyUiIhJUIr6IAV+FBsFmRWKtvYUIon+CgkJQETEookY8Y0BBlLNQMDbBJHf3tbjc3s5zN3czsynm14UNsx9+O7P7m/kd0XxgL2aQTzzHCuID+3LBvMBKkgP7MesZ8jIBQQE3EpgDXjFjaI/vvItQADjMQcx5grzCqgYEf2sUHtPvBfMaHUkIUKfwmEMoO4a8wWoekqTwmCNOMW+xRoTwFB4zgIojyDuslSEihcccc4IZxzoVRKbwmBPWMR+wXg1RUXjMKVQtQj5igw6ipvCYQWuYIjr1EB2FxwxZwUygywTRU3jMmZYxn7HRDDFReMy5liCT6E6DAAwFmiZd3GTD8RDLiFGzMcvm4o/eI2rX/JchK0JmWg99RtIekGWMGZKFAhQsUe6bb7OEFk0ESqAESqAESqAESqAESqA4ppSpauleM2l1uLniL6Pf2uajE8XmNx9lHLa6JevCRHOUCo7ang/oxqSeslRzAFjBcReTE5vwRbN9J8IA3ZWmL+g0ux3/0WNhpU2xqXi0Z9QrXX9YP3Pjz0+qGEqoRqycOZWwPR6xF9+Eq4/Rpj5ZOmsdImL68D1x5Qm3L8f5+MIFJxARswU/4n7QcnF6XAIAXHQGETHbUAIwpu4HXcFlpxARswMPGt0P/aJzAxEwWVa/O8jCMLjmvBtUwtZsX+ZPVHFcEfyk31nz4rY5lWhM5YvJAsEIIueYZKtuJ0Yb3SF51bjF8JBfAN5LmMTydYeRIZAwwnvEDUYNiTGsBqFISNJVdr2BoVsW6pUi7WF/6hAaJf6xjNNu/Zs1cvVKETISZ8ZU20YeIakVf+QPkt75iHxBsjRhIj8Qv/2ge4unH8TCoUagBEqgBEqgBEqgBEqg5EqpWusHldPqcHPFX8FJa5uPzbpGQ5bNh0VIOsb0w8UqDbI78TAdLcyrafavjqGn1LfQB8RlZP7Qvdn4ip70zOgoNiEZMWqKbUgmjIriApIBI1NcQVIxIsUlJAXDU1xDjJgkxQfEgGlQfEG0mDrFJ0SDqVF8Q5QYQiEXiAJDaMsJImH4T6NfiIDJF6LG5ATRZybP+A9tnJrSa1cBQQAAAABJRU5ErkJggg==" x="272" y="118" width="69" height="108" fill="#FFFFFF" opacity=".1" class="foreground" /> <image id="hours1" x="7" y="118" width="69" height="108" fill="#FFFFFF" class="foreground" /> <image id="hours2" x="87" y="118" width="69" height="108" fill="#FFFFFF" class="foreground" /> <image id="mins1" x="194" y="118" width="69" height="108" fill="#FFFFFF" class="foreground" /> <image id="mins2" x="272" y="118" width="69" height="108" fill="#FFFFFF" class="foreground" /> </svg> </svg> </body></html>
Output
You can jump to the latest bin by adding /latest to your URL
Keyboard Shortcuts
| Shortcut | Action |
|---|---|
| ctrl + [num] | Toggle nth panel |
| ctrl + 0 | Close focused panel |
| ctrl + enter | Re-render output. If console visible: run JS in console |
| Ctrl + l | Clear the console |
| ctrl + / | Toggle comment on selected lines |
| ctrl + ] | Indents selected lines |
| ctrl + [ | Unindents selected lines |
| tab | Code complete & Emmet expand |
| ctrl + shift + L | Beautify code in active panel |
| ctrl + s | Save & lock current Bin from further changes |
| ctrl + shift + s | Open the share options |
| ctrl + y | Archive Bin |
Complete list of JS Bin shortcuts | |
JS Bin URLs
| URL | Action |
|---|---|
| / | Show the full rendered output. This content will update in real time as it's updated from the /edit url. |
| /edit | Edit the current bin |
| /watch | Follow a Code Casting session |
| /embed | Create an embeddable version of the bin |
| /latest | Load the very latest bin (/latest goes in place of the revision) |
| /[username]/last | View the last edited bin for this user |
| /[username]/last/edit | Edit the last edited bin for this user |
| /[username]/last/watch | Follow the Code Casting session for the latest bin for this user |
| /quiet | Remove analytics and edit button from rendered output |
| .js | Load only the JavaScript for a bin |
| .css | Load only the CSS for a bin |
Except for username prefixed urls, the url may start with http://jsbin.com/abc and the url fragments can be added to the url to view it differently. | |
public
0viewers