pen
.ylo.one
by rehmat
♥
1
</>
Embed
⌨
Format
▢
Layout
⬇
Editor on top, preview below
⬆
Preview on top, editor below
➡
Editor left, preview right
⬅
Preview left, editor right
▤
Editor only
▥
Preview only
⚙
Settings
▶
Run
💾
Save
⑂
Fork
+
New
Log in
Sign up
Sign up
×
Username
Email
Password
Have an account? Log in
Cancel
Create account
Continue with GitHub
HTML
CSS
JS
Result
HTML
Markdown
Pug
Tidy
<button id=b>click me</button><p id=out></p>
CSS
SCSS
Less
Stylus
Tidy
body{font-family:system-ui;padding:24px;background:#fef9c3} button{font-size:18px;padding:8px 20px;background:#1d4ed8;color:#fff;border:0;border-radius:6px;cursor:pointer} p{margin-top:12px;font-size:18px;color:#1f2937}
JS
Babel (JSX)
TypeScript
CoffeeScript
Tidy
document.getElementById("b").addEventListener("click",()=>document.getElementById("out").textContent="Hello " + new Date().toLocaleTimeString())
Preview
Console
Clear
Full
Console output will appear here.
Pen settings
×
Title
Description
Tags
(comma-separated)
Layout
Editor on top, preview below
Preview on top, editor below
Editor left, preview right
Preview left, editor right
Editor only
Preview only
External CSS resources
+ Add CSS resource
External JS resources
+ Add JS resource
Cancel
Save settings
Comments
Loading…
Log in to leave a comment.
Comments
Log in to leave a comment.