Blueprint by Tiny
Return to Tiny.cloud
Return to Tiny.cloudTry TinyMCE for Free
Search by

Product-led Growth

9 products you can build with TinyMCE

Published July 20th, 2020

Many people have heard of our TinyMCE WYSIWYG editor, but we often find that they don’t realize just how powerful and flexible it is. There really is no limit to the types of products and use cases that can be implemented or enhanced with TinyMCE. It’s quite the chameleon 🦎

Ben Long

Author at Tiny


In an attempt to provide a better understanding of why TinyMCE continues to be used and trusted in over 100M+ products worldwide, here’s an overview of 9 products that can be built with TinyMCE.

Why nine? No reason – these were simply the first nine products that came to mind. Truly, the sky’s the limit when it comes to potential use cases – if it’s imaginable, then it’s possible with Tiny 🚀

GET this guide

Download your own pdf of the ‘9 products you can build with TinyMCE’ to read later or share – to convince your colleagues of the value of having a rich text editor with advanced features.

Download →

1. Blogging platforms

In this blogging platform, TinyMCE is configured with quickbars to emulate the Medium-style editing experience on text selection.

It’s also configured with options for users to insert images, links, media, code snippets, and more – all the usual options you’d expect from a blogging experience. Furthermore, it complies with accessibility requirements for a more inclusive experience for content creators.


2. Real-time chat apps

In this chat app, TinyMCE is configured with the usual subset of formatting options you’ll find in an application of this kind, including the ability to add emojis – now a standard requirement in modern text communications.

Read more about this project in our related blog post on how to build a simple chat app with Deno and a WYSIWYG editor. It also makes use of placeholder text as a prompt for the user.

Speaking of placeholder text…


3. Design tools

Here, TinyMCE is used in a card design tool and is configured with a custom skin, created using the TinyMCE Skin Tool, to blend in seamlessly with the rest of the app. It also has a huge range of custom and popular fonts to choose from.

The editor’s CSS is configured for the true WYSIWYG experience, so users can see exactly what the content will look like without having to use a separate preview. It also features the ‘case change’ plugin, allowing designers to convert text from uppercase to lower to title case quickly when considering their options.


4. Document processors

This document processor is built with TinyMCE, configured with document margins, wordcount, and predefined templates to save time for users so they don’t have to create the same content again and again...and again.

It also includes a global spell checker to ensure content written by anyone in the organization maintains a certain standard and consistency, and checks up to 13 languages simultaneously. The color palette has been customized with a set of colors according to the corporate style guide, and it has a custom skin (for instance, active toolbar buttons are green).

Get Your Free
TinyMCE API Key

Get API Key

5. Note-taking apps

This note-taking app is built with TinyMCE, featuring many of the options already mentioned in other products.

Here, the editor is configured with Tiny’s premium snow skin and icons pack, one of the 10 skins and 4 icon packs we’ve designed for you. It’s also been set up with the ability to insert checklists – a common feature in these types of applications.


6. Email service providers

This is a marketing email platform, built with TinyMCE.

In this case, it has been configured with inline mode, so the toolbar appears directly above an editable area when your cursor is in it and hides otherwise. The toolbar drawer opens to reveal more options, including the ability to insert links, images, emoticons, and lists. A cool feature is that the style formats dropdown is configured with an option to convert any link into a call-to-action button (shown on the right above).


7. Collaborative workspaces

This collaborative workspace is built with TinyMCE. Similar to the note-taking app, it’s also been configured with Tiny’s premium snow skin and icons pack. By the way, Tiny also has its own real-time collaboration solution, that’s encrypted – so no one can eavesdrop on your communication.

You can also provide an empty page placeholder UI containing complex HTML and buttons to insert templates (shown below) – a feature found in popular apps like Notion and Atlassian Confluence.


8. Comments apps

In this comments app, TinyMCE has been configured with a naked skin, allowing the designer to wrap it in a container and customize it with their own border, buttons, and other additional HTML/JS functionality. It’s also been configured with several templates as “canned” replies to cut down the time it takes for users to form responses.


9. Form builders

TinyMCE can also be used for the text entry components of your forms.

This form has been created using the Bootstrap framework, and TinyMCE is configured with the corresponding skin to match. Read more about how to enhance your Bootstrap forms with WYSIWYG editing.

Get started with TinyMCE

Start with a FREE 14-day trial of the Tiny Cloud Essential plan, our ultimate productivity solution. In addition to the core editor, you’ll get access to our Premium Skins and Icons plus 14 premium plugins, including PowerPaste, Enhanced Media Embed, Checklists, Advanced Tables, and Real-time Collaboration. Or see our plans for more options.

See our docs for live TinyMCE examples configured with all the bells and whistles and contact us any time – we’d love to talk about your new, innovative products and help you create the best user experience possible.

Download a PDF of this guide
and save it for later

By completing and submitting the form you’ll receive information and tips from Tiny Technologies.

Want this look for your posts and pages?

Get a Setka demo from our Customer Success team,
or try Setka for 14 days, free.

Related Articles

  • World of WYSIWYG

    Editing modes: Classic view, Inline editing and Distraction free modes

    by Joe Robinson in World of WYSIWYG
Subscribe for the latest insights served straight to your inbox every month.

Deploy TinyMCE in just 6 lines of code

Built to scale. Developed in open source. Designed to innovate.

Begin with your FREE API Key
Tiny Editor
Tiny logo
Privacy Policy - Terms of Use© 2022 Tiny Technologies Inc.TinyMCE® and Tiny® are registered trademarks of Tiny Technologies, Inc.

Products

  • TinyMCE
  • Tiny Drive
  • Customer Stories
  • Pricing