github-social-preview.html (1167B)
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <title>GitHub social preview</title> 5 <style> 6 body { 7 background-color: black; 8 color: white; 9 font-family: -apple-system; 10 font-size: 36px; 11 font-weight: 100; 12 text-align: center; 13 } 14 p.screenshot { 15 background-color: white; 16 box-sizing: border-box; 17 width: 1280px; 18 height: 640px; 19 margin: 40px auto; 20 padding: 40px; 21 } 22 p.screenshot.x2 { 23 width: 640px; 24 height: 320px; 25 padding: 20px; 26 } 27 p.screenshot img { 28 height: 100%; 29 } 30 </style> 31 </head> 32 <body> 33 <p>Take a screenshot of this DOM node to make a PNG.</p> 34 <p>For 2x DPI screens.</p> 35 <p class="screenshot x2"><img src="vertical.svg" alt="preview @ 2x"></p> 36 <p>For regular screens.</p> 37 <p class="screenshot"><img src="vertical.svg" alt="preview"></p> 38 </body> 39 </html>