- Web Maker -
-A blazing fast & offline web playground in your browser
- + .say__handle { + opacity: 0.7; + font-weight: normal; + } + + @media (min-width: 751px) { + .header { + position: fixed; + width: 460px; + left: 0; + } + + body { + padding-left: 460px; + } + + .download-btn { + /* margin: 1rem 0; */ + /* margin: 0 1rem; */ + width: 300px; + } + + .web-app-btn:after { + right: -50px; + } + + .web-app-btn:before { + right: -22px; + } + + .social-bar { + display: none; + position: fixed; + top: 30px; + right: 20px; + opacity: 0.5; + } + + .social-bar > a { + display: block; + margin-top: 10px; + } + + .feature-box { + min-width: 400px; + /* width: 80vw; */ + margin: 0 auto; + } + + .feature { + flex-basis: 50%; + max-width: 50%; + padding: 0.5em 2em; + } + + .info { + display: block; + background: white; + box-shadow: 0 -10px 35px rgba(0, 0, 0, 0.15); + padding: 2rem; + position: fixed; + will-change: transform; + bottom: 0; + transform: translateY(101%); + width: 70vw; + margin-left: -35vw; + left: 50%; + text-align: left; + font-size: 0.9em; + transition: 0.4s cubic-bezier(0.77, -0.1, 0.13, 0.9); + } + + .info.show { + transform: translateY(0); + } + + .people-say-top, + .people-say-bottom { + display: flex; + overflow: scroll; + } + + .say { + width: 18vw; + flex-shrink: 0; + padding: 20px; + } + + .say p { + margin: 20px 0 0 0; + } + } + -
- + Web Maker +
++ A blazing fast & offline web playground in your browser +
+ + + +
- Works Offline
-Lives completely in your browser. There is no network involved, so it opens and shows previews instantly.
-Preprocessor Support
-Be it Markdown, Jade, SCSS, LESS, Atomic CSS, JSX, CoffeeScript or TypeScript - you get it all.
-Quick Add Libraries
-Drop in any library from the available list or put a URL of any other library you wish to add. -
-Multiple Layouts
-Get exact same layout in front of you, that you last saved the creation in. Plus, a full screen layout to see - your work - in actual browser window. -
-Preview screenshot capture
-Feel like taking a screenshot of your awesome creation, just hit the Capture button to get a beautiful screenshot - of - your result. -
-Open in Codepen
-Done with your creation and want to share it with the world? One click and have your work open in CodePen. -
-♥
-
- If you're looking for a CodePen-like offline editor, and use Chrome, check out Web-Maker by Kushagra Gour.
- - -
- Really enjoying using Web Maker - super fast offline web playground.
- - -
- Finding awesome pens on @CodePen and recreating them in @webmakerApp is my new hobby
- - -
- This is something I will be using alot. Thank you! :D
- - -
- It's fantastic! I'm glad I've discovered it! Thanks! +
Works Offline
++ Lives completely in your browser. There is no network involved, so it + opens and shows previews instantly.
- -
- This is like having your own copy of Codepen that also works offline.
- - -
- @webmakerApp looks like a good offline alternative to @CodePen.
- - -
- Meet Web Maker, an Offline, Browser-based CodePen Alternative.
- - -
- Great Chrome extension via @chinchang457. I need offline CodePen from time to time.
- - -
- Thanks for creating this. What a great tool for productivity!
- - - -
- Decided to use it to work on my latest project, it's pretty awesome! Thank you for making this!
- +Preprocessor Support
++ Be it Markdown, Jade, SCSS, LESS, Atomic CSS, JSX, CoffeeScript or + TypeScript - you get it all. +
+Quick Add Libraries
++ Drop in any library from the available list or put a URL of any other + library you wish to add. +
+Multiple Layouts
++ Get exact same layout in front of you, that you last saved the + creation in. Plus, a full screen layout to see your work in actual + browser window. +
+Preview screenshot capture
++ Feel like taking a screenshot of your awesome creation, just hit the + Capture button to get a beautiful screenshot of your result. +
+Open in Codepen
++ Done with your creation and want to share it with the world? One click + and have your work open in CodePen. +
+♥
+
+ + If you're looking for a CodePen-like offline editor, and use Chrome, + check out Web-Maker by Kushagra Gour. +
+ + +
+ + Really enjoying using Web Maker - super fast offline web playground. +
+ + +
+ + Finding awesome pens on @CodePen and recreating them in @webmakerApp + is my new hobby +
+ + +
+ This is something I will be using alot. Thank you! :D
+ + +
+ It's fantastic! I'm glad I've discovered it! Thanks!
+ +
+ + This is like having your own copy of Codepen that also works + offline. +
+ + +
+ @webmakerApp looks like a good offline alternative to @CodePen.
+ + +
+ Meet Web Maker, an Offline, Browser-based CodePen Alternative.
+ + +
+ + Great Chrome extension via @chinchang457. I need offline CodePen + from time to time. +
+ + +
+ Thanks for creating this. What a great tool for productivity!
+ -Web Maker needs the following permissions to work with full capabilities. In words of Chrome extensions:
- -- Read & change all your data on the websites that you visit - Worry not. This is just required for - the new tab - replacement feature where Web Maker shows up only if the new tab url is chrome://newtab/. Nothing is read, stored or - changed. -
- -Disclaimer
-Web Maker - does not track any user specific data. It uses Google Analytics to track aggregated events to - improve user experience - based on what features are used more. If still you want to opt-out of Google Analytics tracking, please visit - https://tools.google.com/dlpage/gaoptout or - you can set up a filter in Adblock Plus or similar ad blocker tools like - AdBlock, uBlock or Adblock Pro.
-+ Web Maker needs the following permissions to work with full + capabilities. In words of Chrome extensions: +
- - 🏠 Go to Web Maker 4's new home ++ Read & change all your data on the websites that you visit + - Worry not. This is just required for the new tab replacement feature + where Web Maker shows up only if the new tab url is chrome://newtab/. + Nothing is read, stored or changed. +
- +