Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>Using Pico</title>
  <link rel="stylesheet" href="https://unpkg.com/@picocss/pico@latest/css/pico.min.css">
​
</head>
<body class="container">
  <header>
<nav>
  <ul>
    <li><h1><a href="#">Freelancer</a></h1></li>
  </ul>
  <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">Blog</a></li>
    <li><a href="#">About</a></li>
    <li><a href="#">Contact</a></li>
  </ul>
</nav>
  <hgroup>
  <h4>Software Developer in Lafayette, Louisiana</h2>
  <h6>Enjoying writing and coding.</h6>
<hgroup>
​
  </<header>
  
  <main>
    <article>
      <h3>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aut, magni!</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facere commodi deleniti porro officiis quisquam laborum eos perferendis dolores recusandae expedita, repudiandae fuga reiciendis, voluptas eum optio nobis! Adipisci dolore molestiae nisi hic ea deserunt nobis dolorum animi, laboriosam pariatur, fugiat, soluta quisquam impedit tempora quaerat a officia, veniam commodi iste?</p>
        <p>Doloribus quasi velit autem dolor laboriosam, distinctio, laborum provident voluptatum asperiores suscipit reprehenderit perferendis repellendus expedita delectus sit! Officia dolores, at officiis voluptates qui recusandae esse, corporis sunt, asperiores impedit ipsa. Maiores maxime blanditiis odit incidunt beatae quos suscipit illum iste magni tenetur quas hic, nemo, id alias esse explicabo?</p>
        <p>Labore enim delectus rem, suscipit quibusdam accusantium, recusandae dolorem, perspiciatis, voluptate ad ea deleniti expedita saepe tempore perferendis cupiditate beatae. Esse distinctio, sint. Aspernatur recusandae mollitia, eaque velit blanditiis maiores voluptatum expedita. Consequuntur placeat excepturi repudiandae aliquam dignissimos sit quo aut! Quis sapiente, nulla voluptas voluptate provident architecto nostrum esse!</p>
      <a href="#" role="button">Read More</a>
    </article>
    
    <article>
      <h3>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aut, magni!</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facere commodi deleniti porro officiis quisquam laborum eos perferendis dolores recusandae expedita, repudiandae fuga reiciendis, voluptas eum optio nobis! Adipisci dolore molestiae nisi hic ea deserunt nobis dolorum animi, laboriosam pariatur, fugiat, soluta quisquam impedit tempora quaerat a officia, veniam commodi iste?</p>
        <p>Doloribus quasi velit autem dolor laboriosam, distinctio, laborum provident voluptatum asperiores suscipit reprehenderit perferendis repellendus expedita delectus sit! Officia dolores, at officiis voluptates qui recusandae esse, corporis sunt, asperiores impedit ipsa. Maiores maxime blanditiis odit incidunt beatae quos suscipit illum iste magni tenetur quas hic, nemo, id alias esse explicabo?</p>
        <p>Labore enim delectus rem, suscipit quibusdam accusantium, recusandae dolorem, perspiciatis, voluptate ad ea deleniti expedita saepe tempore perferendis cupiditate beatae. Esse distinctio, sint. Aspernatur recusandae mollitia, eaque velit blanditiis maiores voluptatum expedita. Consequuntur placeat excepturi repudiandae aliquam dignissimos sit quo aut! Quis sapiente, nulla voluptas voluptate provident architecto nostrum esse!</p>
      <a href="#" role="button">Read More</a>
    </article>
    
    <article>
      <h3>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aut, magni!</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facere commodi deleniti porro officiis quisquam laborum eos perferendis dolores recusandae expedita, repudiandae fuga reiciendis, voluptas eum optio nobis! Adipisci dolore molestiae nisi hic ea deserunt nobis dolorum animi, laboriosam pariatur, fugiat, soluta quisquam impedit tempora quaerat a officia, veniam commodi iste?</p>
        <p>Doloribus quasi velit autem dolor laboriosam, distinctio, laborum provident voluptatum asperiores suscipit reprehenderit perferendis repellendus expedita delectus sit! Officia dolores, at officiis voluptates qui recusandae esse, corporis sunt, asperiores impedit ipsa. Maiores maxime blanditiis odit incidunt beatae quos suscipit illum iste magni tenetur quas hic, nemo, id alias esse explicabo?</p>
        <p>Labore enim delectus rem, suscipit quibusdam accusantium, recusandae dolorem, perspiciatis, voluptate ad ea deleniti expedita saepe tempore perferendis cupiditate beatae. Esse distinctio, sint. Aspernatur recusandae mollitia, eaque velit blanditiis maiores voluptatum expedita. Consequuntur placeat excepturi repudiandae aliquam dignissimos sit quo aut! Quis sapiente, nulla voluptas voluptate provident architecto nostrum esse!</p>
      <a href="#" role="button">Read More</a>
    </article>
    
    <article>
      <h3>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aut, magni!</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facere commodi deleniti porro officiis quisquam laborum eos perferendis dolores recusandae expedita, repudiandae fuga reiciendis, voluptas eum optio nobis! Adipisci dolore molestiae nisi hic ea deserunt nobis dolorum animi, laboriosam pariatur, fugiat, soluta quisquam impedit tempora quaerat a officia, veniam commodi iste?</p>
        <p>Doloribus quasi velit autem dolor laboriosam, distinctio, laborum provident voluptatum asperiores suscipit reprehenderit perferendis repellendus expedita delectus sit! Officia dolores, at officiis voluptates qui recusandae esse, corporis sunt, asperiores impedit ipsa. Maiores maxime blanditiis odit incidunt beatae quos suscipit illum iste magni tenetur quas hic, nemo, id alias esse explicabo?</p>
        <p>Labore enim delectus rem, suscipit quibusdam accusantium, recusandae dolorem, perspiciatis, voluptate ad ea deleniti expedita saepe tempore perferendis cupiditate beatae. Esse distinctio, sint. Aspernatur recusandae mollitia, eaque velit blanditiis maiores voluptatum expedita. Consequuntur placeat excepturi repudiandae aliquam dignissimos sit quo aut! Quis sapiente, nulla voluptas voluptate provident architecto nostrum esse!</p>
      <a href="#" role="button">Read More</a>
    </article>
    
    <article>
      <h3>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aut, magni!</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facere commodi deleniti porro officiis quisquam laborum eos perferendis dolores recusandae expedita, repudiandae fuga reiciendis, voluptas eum optio nobis! Adipisci dolore molestiae nisi hic ea deserunt nobis dolorum animi, laboriosam pariatur, fugiat, soluta quisquam impedit tempora quaerat a officia, veniam commodi iste?</p>
        <p>Doloribus quasi velit autem dolor laboriosam, distinctio, laborum provident voluptatum asperiores suscipit reprehenderit perferendis repellendus expedita delectus sit! Officia dolores, at officiis voluptates qui recusandae esse, corporis sunt, asperiores impedit ipsa. Maiores maxime blanditiis odit incidunt beatae quos suscipit illum iste magni tenetur quas hic, nemo, id alias esse explicabo?</p>
        <p>Labore enim delectus rem, suscipit quibusdam accusantium, recusandae dolorem, perspiciatis, voluptate ad ea deleniti expedita saepe tempore perferendis cupiditate beatae. Esse distinctio, sint. Aspernatur recusandae mollitia, eaque velit blanditiis maiores voluptatum expedita. Consequuntur placeat excepturi repudiandae aliquam dignissimos sit quo aut! Quis sapiente, nulla voluptas voluptate provident architecto nostrum esse!</p>
      <a href="#" role="button">Read More</a>
    </article>
  </main>
  <footer>
    <p><small>&copy;admixweb</small></p>
  </footer>
</body>
</html>
 
​
 
​
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
teylorfelizpro
0viewers