Use the wysiwyg text editor component from Flowbite to create and modify content by manipulating paragraphs, headings, images and styling them using all available options
Hey Product Hunt 👋
If you've ever had to build a WYSIWYG editor for your project, you know how hard it is to find a reliable and easy to work with editor. Most of the ones that are one the market are either extremely opinionated with a lot of magic behind or they paywall most of the basic features.
A couple of weeks ago we have tackled this challenge and built an open-source WYSIWYG text editor using Tailwind CSS and based on our own design system and JS library. The editor uses the headless Tip Tap library for basic functionality, but our examples provide you with all of the tools that you need to directly plug-and-play into your application.
Our examples features:
- editing text, images, videos, tables, exporting data
- built with Tailwind CSS and the Flowbite UI Library
- supports dark mode and RTL by default
- responsive design and mobile-first approach
- ... and many more!
Long story short, check it out yourself:
https://flowbite.com/docs/plugin...
It's pretty easy to get started, just have Tailwind CSS + Flowbite installed and you can even get it working using only CDN links for the JS part. After that, you only need to copy-paste the HTML and JavaScript code and you have a fully functioning WYSIWYG for your project.
What sets this apart from other WYSIWYG text editors is the fact that it is extremely easy to set up and also edit in terms of components and functionality because all elements are there for you to edit, there is no magic behind this component.
Enjoy and with much love from the Flowbite community 💙
Is there any planned support for table customization, like sorting and filtering?
Love this! Searched a lot for a good one but was really hard to find any. Will be using it for OpenUnited.com 🙌
As a no-code builder, would LOVE to use this in Bubble (it's SO hard to find a decent WYSIWYG text editor plugin over there). @zoltanszogyenyi if you were to spin up a quick Bubble plugin, I'd be your first user.
oh damn, super nicely executed! 💖
I could see myself using this to whip up a super simple blog editor to add content pages to my next.js projects.
It looks like currently it exports to json and html, any plans to do a markdown export? I presume that'd only support a subset of the WYSIWYG features, but would still be super nice to have that flexibility.
Great work anyway!
About Flowbite WYSIWYG on Product Hunt
“Open-source text editor with Tailwind CSS”
Flowbite WYSIWYG launched on Product Hunt on October 11th, 2024 and earned 356 upvotes and 5 comments, earning #3 Product of the Day. Use the wysiwyg text editor component from Flowbite to create and modify content by manipulating paragraphs, headings, images and styling them using all available options
Flowbite WYSIWYG was featured in Design Tools (259.5k followers), Open Source (68.3k followers) and GitHub (41.2k followers) on Product Hunt. Together, these topics include over 65.7k products, making this a competitive space to launch in.
Who hunted Flowbite WYSIWYG?
Flowbite WYSIWYG was hunted by Zoltán Szőgyényi. A “hunter” on Product Hunt is the community member who submits a product to the platform — uploading the images, the link, and tagging the makers behind it. Hunters typically write the first comment explaining why a product is worth attention, and their followers are notified the moment they post. Around 79% of featured launches on Product Hunt are self-hunted by their makers, but a well-known hunter still acts as a signal of quality to the rest of the community. See the full all-time top hunters leaderboard to discover who is shaping the Product Hunt ecosystem.
Want to see how Flowbite WYSIWYG stacked up against nearby launches in real time? Check out the live launch dashboard for upvote speed charts, proximity comparisons, and more analytics.
Zoltán Szőgyényi