Liveweave: Generative AI Web Editor & HTML/CSS/JS Playground
Initializing
Liveweave
Web
expand_more
home
Home
Palette
Color Explorer
arrow_outward
Polyline
Graphics Editor
arrow_outward
frame_source
Python Playground
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
Fork
account_circle
Login
settings
Settings
expand_more
Editor font
14
px
A
A
Line number
Mini map
Word wrap
sync_alt
Reset Settings
smart_display
Run
left_panel_close
AI Assistant
dashboard
All
HTML
CSS
JS
visibility
Preview
bolt
Live Preview
terminal
JS Console
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Fuzzy Text Paragraph in CSS</title> </head> <body> <div class="fancy-text"> <p>Welcome to the vibrant world of colorful design! Let your creativity flow and shine as bright as the rainbow with every stroke of your imagination. Embrace the spectrum of colors and let each hue tell its unique story, creating a masterpiece that dazzles the eyes and warms the heart.</p> </div> </body> </html>
body { margin: 0; padding: 0; display: flex; justify-content: center; align-items: center; height: 100vh; background: lightb; /* Light background for contrast */ font-family: 'Arial', sans-serif; } .fancy-text p { font-size: 2rem; font-weight: bold; text-align: center; background: linear-gradient(45deg, #ff6b6b, #f06595, #fcf5c7, #48c9b0, #1e90ff); /* Gradient background for text */ -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; text-fill-color: transparent; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3), 0 0 5px rgba(255, 0, 150, 0.5), 0 0 10px rgba(255, 0, 150, 0.5); margin: 0; padding: 20px; }
// Write JavaScript here
terminal
JavaScript Console
Preview
Clear
close
›
Run