What are some good free WYSIWYG HTML editors?

This is just to edit fairly simple generated 1-3 page HTML pages. Notepad++ is strictly text and so too slow.
I would like to delete sections, move up divisions and change Font sizes and type easily.

I’ve seen TinyMCE, QuillJS and CKEditor come up as recommendations.

Primary use will probably be to modify the output of Fastcharacter maker.

I don’t think a rich text editor like the ones you mentioned would be very good at something like this without heavy customization. Those are typically B2B tools used by web developers to add some specific formatting functionality to their web app, not for general purpose end user use like in your case. They will probably struggle with the complex layout of a character sheet like this.

Dreamweaver (it’s still around!) might be able to do it, but you’d have to give it the CSS and assets (images, fonts, etc.) too. It’s not free but there is a free trial available. There’s another editor called Pinegrow too, but I’ve never used it.

If this is just a one time edit you want to make before you print it, it would probably be easier to just use your browser’s inspector (part of the developer tools) to directly edit the HTML and styling in-place. It’s not quite a traditional WYSIWYG experience (the way Dreamweaver or Word are), but it’s real-time and you can easily see the page update as you delete sections or change the font sizes. Use the element picker to point and click on what you want to change, and then edit the content in the HTML tree or the styling in the right sidebar.

I suspect the layout may shift around a bit if you fiddle too much, making printing difficult. An editable PDF character sheet or such might be better. There should be other D&D and OGL / Pathfinder tools that can make those, bypassing the HTML formatting step.

I wonder if there’s one available for Canva or Figma?


If it helps, feel free to list some specific changes you want to make, and I can see if there’s an easy way to make them. You can save the output HTML as a file and DM it to me too if you like.

And just for background context & clarity: I answered the way I did because the term “WYSIWYG HTML editor” typically does not mean what it did in the 90s and 2000s anymore.

These days, it usually refers to an embedded rich text editor, meant for inclusion in web apps, to provide basic text formatting needs (bold, italics, maybe tables if you’re lucky). But they generally cannot handle the complex divs, flexboxes, stylesheets and the such that make up modern websites. It would likely take quite some work (as in custom programming with their APIs) to get them to work right with something like the character sheets… I’d be surprised if any of them supported that sort of layout out of the box.

I don’t know what you call the traditional kind of powerful desktop HTML editor anymore, the kind that can actually visually lay out a page. They are very very rare these days, with Dreamweaver being the only major survivor from the old days. I haven’t tried that other Pinegrow one, but it looks interesting. I don’t know of any free / open source ones that are still maintained.

The web has become such a complex mess dominated by big frameworks (WordPress, React, etc.) that there isn’t a big market for the traditional desktop visual page editor anymore. RIP Frontpage, etc.

Firefox Developer Edition might fit the bill - it has realtime rendering of changes made to code

Hmm, interesting. It seems like it’s mostly the same as the standard dev tools any browser has, but with some beta features enabled (for animations, rulers, etc.)? But it doesn’t seem to fundamentally change the “editing” / debugging workflow, like you’re still just editing the DOM inside the inspector and adjusting styles in a side panel? Is that correct?

I’ve not got as far as using it in earnest - only kept on encountering it on my search for this kind of tool. It just seems like about as close as you can get to a modern visual web editor.

Hmm, as far as I can tell, it’s just a rebranded (theme and profile) Firefox beta:
Reddit - Dive into anything

Detailed difference between Firefox, Beta, Dev and Nightly | Firefox Support Forum | Mozilla Support

There’s nothing wrong with that, but the real time code rendering part of that is available in every browser these days. You don’t need a special Firefox (or Firefox at all) to use that. Like in Chrome, ctrl-shift-c should get you the same functionality.

Thanks for the excellent replies, I’m going to just try the chrome editor and see if it is better than Notepad++, that I’ve used.

I miss the developer tools I had when I was still working.

I’ve been playing with it for just a few minutes, and this is already a huge improvement over any text based editor.

ctrl-shift-c is my friend.

Thank you so much.

Yeah, it’s pretty amazing how good they (the dev tools) have gotten. Glad that does the job.

Out of curiosity, what might those have been? Were they WYSIWYG tools? I have a few decades to go, yet, and wouldn’t mind paying for one :slight_smile:

The one I liked was part of a complete development package. Clover was the report writer and I think the program and page tool was called WebSmart. This was for use mainly over AS400/iSeries.

I did use Frontpage for a time 20 years ago or so. The old crappy Microsoft tool, even that would be helpful for edited a static page though. It looks like they now offer a free tool, I probably should check it out.
https :// /detail/9p031 qtnzzsv?hl=en-US&gl=GI

When you say “they offer” that sounds like you think that tool is by MSFT. It is not. That’s a third-party app just like the things you cited upthread.

Oh wow, that was a few moons ago, wasn’t it? :grinning_face:

That’s just some random third party tool, FYI. The Microsoft Store is just their latest dumb name for an app store. They didn’t actually make it, somebody called “AI Power” did.

Ninjaed!

It kinda looks like TinyMCE, in fact. I wouldn’t be surprised if someone just packaged that editor in a webview and put it on the store.

That tool is garbage, Removing now. I f’d up and thought it was from Microsoft. Damn, I’m usually more careful. I’m going to break my link in fact.

Last time I used Clover/Websmart was 2014. So yes. My last job was almost 5 years ago now. Very little HTML stuff on the last 2 jobs.

Hell, I’m a web developer and there’s still been very little HTML stuff in the last few years :slight_smile: It’s mostly written in some higher-level UI abstraction now (like JSX)… for better or worse.

Last week I had to help a customer troubleshoot their simple marketing site. It was like 5 pages with a few sentences and images that could’ve easily been written in regular HTML. But the person who made the site for them did it in some horribly bloated framework that takes several thousand files’ worth of dependencies, libraries, and components in order to make those 5 pages. Crazy world.

Back in the day TinyMCE was astoundingly good. Probably still is.

But as a web dev, I almost entirely disabled the functionality so clients could not make ill-advised colour/font/image/etc choice. Because, if I learned anything in my first year’s employment, it is that clients are idiots with bad taste.

Don’t get me wrong, it still is! We still use and support it in our web app (a CMS), and many of our clients fork and extend it for their own purposes.

It’s just not a replacement for Dreamweaver’s full power (feels weird to say that, but Macromedia / Adobe did a good job there, relative to Frontpage etc., especially for the later Dreamweaver versions that had good handling and visual layout for flexboxes and such).

TinyMCE and its ilk are great for their intended use case: rich text editors. They’re not meant to be full page builders like Dreamweaver or the WordPress Gutenberg and Elementor editors and such.

“Idiots with bad taste” is how we have job security at all :wink: Yesterday’s mistakes are today’s lunch money.