Datasetpublic

SALT-NLP/Design2Code

This dataset consists of 484 webpages from the C4 validation set, serving the purpose of testing multimodal LLMs on converting visual designs into code implementations. Each example is a pair of source HTML and screenshot ({id}.html and {id}.png). See the dataset in the huggingface format here. Note that all images in these webpages are replaced by a placeholder image (rick.jpg) Please refer to our project page and our paper for more information. Example Usage For example, you… See the full description on the dataset page: https://huggingface.co/datasets/SALT-NLP/Design2Code.

sourceHugging Faceodc-byupdated 3y agoView on Hugging Face

22likes1.8kdownloads

root13302.html

13302.html114 linesDownload Raw Back to root

1<!DOCTYPE html>2<html lang="en">3 <head>4  <meta charset="utf-8">5  <meta content="width=device-width, initial-scale=1.0" name="viewport">6  <title>7   Farewell Skycade Players8  </title>9  <style>10   @font-face {11  font-family: 'Montserrat';12  font-style: normal;13  font-weight: 400;14  font-display: swap;15  src: url(https://fonts.gstatic.com/s/montserrat/v26/JTUHjIg1_i6t8kCHKm4532VJOt5-QNFgpCtr6Hw5aX8.ttf) format('truetype');16}17@font-face {18  font-family: 'Montserrat';19  font-style: normal;20  font-weight: 500;21  font-display: swap;22  src: url(https://fonts.gstatic.com/s/montserrat/v26/JTUHjIg1_i6t8kCHKm4532VJOt5-QNFgpCtZ6Hw5aX8.ttf) format('truetype');23}24@font-face {25  font-family: 'Montserrat';26  font-style: normal;27  font-weight: 600;28  font-display: swap;29  src: url(https://fonts.gstatic.com/s/montserrat/v26/JTUHjIg1_i6t8kCHKm4532VJOt5-QNFgpCu173w5aX8.ttf) format('truetype');30}31@font-face {32  font-family: 'Montserrat';33  font-style: normal;34  font-weight: 700;35  font-display: swap;36  src: url(https://fonts.gstatic.com/s/montserrat/v26/JTUHjIg1_i6t8kCHKm4532VJOt5-QNFgpCuM73w5aX8.ttf) format('truetype');37}38@font-face {39  font-family: 'Montserrat';40  font-style: normal;41  font-weight: 800;42  font-display: swap;43  src: url(https://fonts.gstatic.com/s/montserrat/v26/JTUHjIg1_i6t8kCHKm4532VJOt5-QNFgpCvr73w5aX8.ttf) format('truetype');44}45 46 47 48        * {49            font-family: 'Montserrat',sans-serif;50        }51        body {52            background-color: #f3f3f3;53            font-family: Arial, sans-serif;54            color: #333;55            padding: 20px;56            background-color: #f3f3f3;57    background: url('background.png');58    background-size: 100px;59        }60        .container {61            max-width: 800px;62            margin: 0 auto;63            font-weight: 500;64            background: #363e46;65            line-height: 1.5;66    padding: 35px ;67    padding-top: 10px;68 69    color: #dadada;70    border-radius: 4px;71        }72        .logo {73            margin: 0 auto;74            max-width: 800px;75            width: 100%;76            display:block;77            padding-bottom:40px;78        }79        strong {80            color: #878ebe;81        }82        h1 {83            font-weight: 700;84        }85  </style>86 </head>87 <body>88  <img class="logo" src="rick.jpg">89  <div class="container">90   <h1>91    Dear Skycade Players,92   </h1>93   <p>94    We want to extend a heartfelt thank you to all of you for being part of our Minecraft network. It's been an incredible journey filled with many memorable moments, and we couldn't have come this far without each one of you.95   </p>96   <p>97    However, everything has its season, and it's time to say goodbye to our forums. After much deliberation, we've decided to shut down the Skycade forums.98   </p>99   <p>100    Even though our server and forum are closing, the memories we've created together will always remain. We are grateful for all the fun times, challenging games, and the friendships that were formed.101   </p>102   <p>103    Until we meet again in another world, happy gaming!104   </p>105   <p>106    Sincerely,107   </p>108   <strong>109    - The Skycade Team110   </strong>111  </div>112 </body>113</html>114