Initializing...
Liveweave
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
build
Tools
expand_more
restart_alt
Load base template
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> <head> <title>Liveweave</title> </head> <body> <div class="wrapper"> <div> <h2>First Header</h2> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ullamcorper velit non velit accumsan, eget porttitor ante faucibus. Donec sed adipiscing orci. Praesent ipsum dui, eleifend ac semper fringilla, ultricies sit amet eros. Vivamus tristique nulla nec libero ultricies, in luctus libero malesuada. Curabitur fringilla porta libero, id egestas libero vehicula feugiat. Nulla tempus odio ut tristique tempus. Nulla eleifend lorem adipiscing, congue erat laoreet, pretium nunc. Mauris vitae tincidunt sapien. Duis turpis nisl, hendrerit quis accumsan et, iaculis eget risus. Quisque euismod purus sed ipsum iaculis tincidunt. Maecenas sed molestie metus, eu tincidunt massa. Proin ullamcorper imperdiet vulputate. Suspendisse porta, eros eget dapibus pellentesque, diam diam adipiscing orci, quis suscipit odio orci sed enim. Nam id enim nec massa venenatis ultricies. </div> <div> <h2>Second Header</h2> Sed tristique vulputate libero, eget malesuada enim. Fusce viverra arcu at arcu condimentum, eu accumsan dolor sagittis. Mauris ut posuere justo, sed tristique massa. Nulla sit amet neque ornare, imperdiet justo vel, bibendum diam. Cras bibendum egestas iaculis. Sed quis elementum lacus. Phasellus interdum purus purus, at scelerisque velit mollis blandit. Donec ut magna mattis, volutpat magna ut, volutpat est. Nam at suscipit nulla, in mollis neque. Praesent dolor urna, mattis vel eleifend nec, tristique lobortis massa. Donec molestie faucibus nunc, ut sodales tortor adipiscing at. Donec dignissim neque odio, non rhoncus odio lobortis quis. Proin ut tortor nulla. Ut molestie ut mi sed sodales. Nullam malesuada mauris quis ligula varius volutpat.Etiam vestibulum neque non turpis facilisis sodales vel bibendum nisi. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc a urna vitae urna commodo ultricies. Curabitur nulla est, porttitor ut odio at, vulputate porta magna. Pellentesque dictum magna sit amet turpis ultrices, eget mollis augue consequat. Nunc non metus non tortor cursus interdum. Vivamus sed quam et urna lacinia commodo. </div> </div> </body> </html>
.wrapper { column-count: 2; -moz-column-count:2; /* Firefox */ -webkit-column-count:2; /* Safari and Chrome */ }