Initializing
Liveweave
Web
expand_more
home
Home
data_object
CSS Explorer
arrow_outward
Palette
Color Explorer
arrow_outward
Polyline
Graphics Editor
arrow_outward
outbox_alt
Generative AI
arrow_outward
frame_source
Python Playground
New
arrow_outward
build
Tools
expand_more
restart_alt
Load "Hello Weaver!"
post_add
Generate Lorem ipsum...
code
Format HTML
code_blocks
Format CSS
data_object
Format JavaScript
library_add
Library
expand_more
A
Algolia JS
Animate CSS
Apex Charts JS
B
Bulma CSS
Bootstrap
C
Chart JS
Chartist
Create JS
D
D3
Dojo
F
Foundation
Fullpage JS
G
Granim JS
Google Charts
H
Halfmoon
J
jQuery
M
Materialize
Moment JS
Masonry JS
Milligram CSS
P
Pure CSS
Primer CSS
Popper JS
Pattern CSS
Picnic CSS
R
React JS
Raphael JS
Raisin CSS
S
Semantic UI
Skeleton CSS
Spectre CSS
Tachyons CSS
T
Tailwind
Three JS
U
UI Kit
Vis JS
W
Water CSS
download
Download
expand_more
developer_mode
Download as HTML
folder_zip
Download as .ZIP
cloud_upload
Save
account_circle
Login
settings
Settings
expand_more
14
px
Live mode
Night mode
Line number
Mini map
Word wrap
sync_alt
Reset Settings
smart_display
Run
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta property="og:type" content="article" /> <meta name="author" content="" /> <meta name="keywords" content="" /> <meta name="description" content="" /> <meta name="og:title" property="og:title" content="" /> <meta name="og:description" property="og:description" content="" /> <meta name="og:image" property="og:image" content="" /> <meta name="twitter:title" content="" /> <meta name="twitter:description" content="" /> <meta name="twitter:image" content="" /> <meta name="twitter:card" content="summary_large_image" /> <!-- Tailwind CSS --> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.2.19/tailwind.min.css" crossorigin="anonymous" referrerpolicy="no-referrer" /> <!-- Pazly Colors --> <link rel="stylesheet" href="https://pazly.dev/colors/gradients.css" /> <link rel="stylesheet" href="https://pazly.dev/colors/backgrounds.css" /> <link rel="stylesheet" href="https://pazly.dev/colors/text.css" /> <link rel="stylesheet" href="https://pazly.dev/colors/border.css" /> <style> body { overflow-x: hidden; } h1, h2, h3, h4, h5, h6 { line-height:1.3 !important; } .stretchToScreen { width:100vw; height:100vh; } </style> <!-- Fontswesome --> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css"> <script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/js/all.min.js"></script> </head> <body class="m-0 p-0 stretchToScreen"> <!-- Pazly Blocks Come Here --> <section id="pazly-template-set" class="m-0 p-0 stretchToScreen bg-white"> <header xmlns="http://www.w3.org/1999/xhtml" class="text-p-gray-700 body-font shadow"> <div class="container mx-auto flex flex-wrap p-5 flex-col md:flex-row items-center justify-between"> <a pazly-editable="href" class="flex title-font font-medium items-center px-2 text-p-gray-900 mb-4 md:mb-0"> <img pazly-editable="src child" src="https://www.900lbs.com/_next/image?url=%2F900lbs-logo-orange.png" style="height: 40px; margin-top: 10px; margin-bottom: 10px;" alt="logo" class /> <span pazly-editable="innerHTML child" class="ml-3 text-xl whitespace-pre-line">900lbs </span> </a> <div class="flex flex-col md:flex-row"> <nav class="flex flex-wrap items-center text-center justify-center pb-4 md:pb-0"> <a pazly-editable="innerHTML href" target="_blank" class="mr-5 hover:text-p-gray-900 cursor-pointer whitespace-pre-line" href="https://www.900lbs.com/news">Company News</a> <a pazly-editable="innerHTML href" target="_blank" class="mr-5 hover:text-p-gray-900 cursor-pointer whitespace-pre-line" href="https://www.900lbs.com/portfolio">Portfolio</a> <a pazly-editable="innerHTML href" target="_blank" class="mr-5 hover:text-p-gray-900 cursor-pointer whitespace-pre-line" href="https://www.900lbs.com/about">About</a> </nav> <div class="flex flex-row"> <a pazly-editable="innerHTML href bg" target="_blank" class="bg-p-gray-200 hover:bg-p-gray-400 text-p-gray-800 ml-4 py-2 px-3 rounded-lg whitespace-pre-line" href="https://www.youtube.com/@900lbs/videos">YouTube</a> <a pazly-editable="innerHTML href bg" target="_blank" class="bg-black hover:bg-p-gray-800 text-white ml-4 py-2 px-3 rounded-lg whitespace-pre-line" href="https://www.900lbs.com/">Website</a> </div> </div> </div> </header> <section xmlns="http://www.w3.org/1999/xhtml" class="w-full py-16 bg-p-bluegray-50"> <div class="container mx-auto flex flex-wrap items-center"> <div class="w-10/12 md:w-6/12 lg:w-4/12 px-12 md:px-4 mr-auto ml-auto"> </div> <div class="w-full flex flex-col md:w-1/2 px-4"> <div class="w-full flex flex-row justify-between align-start"> <div class="w-1/2 flex flex-col mx-2"> <div class="px-4 py-5 flex-auto"> <h6 pazly-editable="innerHTML" class="text-xl mb-1 font-semibold whitespace-pre-line">⚡ WHO WE ARE.</h6> <p pazly-editable="innerHTML" class="mb-4 text-p-gray-600 whitespace-pre-line">900lbs is a future-focused experience design agency who combines emerging technologies and visual content tools to bring your big ideas to life.</p> </div> </div> <div class=" w-1/2 flex flex-col mx-2"> <div class="px-4 py-5 flex-auto"> <h6 pazly-editable="innerHTML" class="text-xl mb-1 font-semibold whitespace-pre-line">
.lw { font-size: 60px; }
// Write JavaScript here