Examples
See what you can build
Explore real-world editor configurations built with Typix. Each example showcases a different use case — from simple text inputs to AI-powered interfaces — so you can find the right starting point for your next project.
FeaturedEditor
Default text editor
Learn how to create a default rich text editor with Typix.
rich-texttoolbarbasic
beginner
Explore exampleLoading preview...
Formatting
Add content formatting to your Typix Editor.
bolditalicheadings
Editor
beginner
Auto Link
Automatically detect and linkify URLs as you type.
linksauto-detecturls
Editor
beginner
Context Menu
Right-click context menu with formatting and editor actions.
right-clickmenuactions
Editor
beginner
Character Limit
Show a live character count and enforce a maximum length.
counterlimitvalidation
Editor
beginner
Max Length
Hard-limit input length and prevent typing beyond it.
limitconstraintinput
Editor
beginner
Tab Focus
Control focus behavior and tab key interactions in the editor.
focusaccessibilitykeyboard
Editor
beginner
Floating Link
Floating toolbar for inserting and editing hyperlinks inline.
linkstoolbarinline
Editor
intermediate
Collapsible
Collapsible sections to hide and reveal content blocks.
collapsesectionsblocks
Editor
intermediate
Draggable Blocks
Drag and reorder content blocks with a handle.
dragreorderblocks
Editor
intermediate
Images
Drop images directly into the editor via drag-and-drop.
imagesdrag-dropmedia
Editor
intermediate
Code Editor
Code blocks with syntax highlighting powered by Prism.
codesyntaxprism
Editor
intermediate
Mentions
@ mentions with an autocomplete dropdown for users.
@mentionautocompleteusers
Editor
intermediate
Keywords
Highlight special keywords as styled nodes in the editor.
highlightnodescustom
Editor
intermediate
Coming soon
Markdown Shortcuts
Add markdown shortcuts to your Typix Editor.
markdownshortcutssyntax
Editor
beginner
Coming soon
Tasks
Add task lists to your Typix Editor.
taskschecklisttodos
Editor
beginner
Coming soon
Tables
Add tables to your Typix Editor.
tablesgriddata
Editor
intermediate
Coming soon
Minimal Note
A clean, distraction-free writing experience for quick notes.
minimalnotewriting
Editor
beginner
AI Autocomplete
AI-powered inline autocomplete suggestions as you type.
aiautocompletesuggestions
Ai
intermediate
Speech to Text
Dictate content with real-time speech-to-text transcription.
speechvoiceai
Ai
intermediate
Coming soon
AI Chat Interface
A conversational editor with markdown rendering and streaming-style input.
chatstreamingai
Ai
advanced
Coming soon
Slack / Discord Messenger
A messaging-style editor with mentions, emoji, and slash commands.
messagingmentionsslash-commands
Collaboration
advanced
Coming soon
Comment Thread
A lightweight comment editor for forums with mentions and reactions.
commentsreactionsthread
Collaboration
intermediate