Documentation


Themes

Spectral theme

Download, or include the library https://cdn.jsdelivr.net/npm/[email protected]/muds-spectral.min.css





<style>
html, body {
    background: linear-gradient(to right, #93F9B9, #1D976C) !important;
}
</style>

<!-- Include the MUDS stylesheet -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/muds.min.css">

<!-- Include the royal theme stylesheet -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/muds-spectral.min.css">

<!-- Create the editor container -->
<textarea id="editor"></textarea>

<!-- Include the MUDS library -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/muds.min.js"></script>

<!-- Initialize MUDS editor -->
<script>
var muds = new muds({
    selector: 'editor',
    theme: 'spectral'
});
</script>
                    







Darkmoon theme


Download, or include the library https://cdn.jsdelivr.net/npm/[email protected]/muds-darkmoon.min.css








<!-- Include the MUDS stylesheet -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/muds.min.css">

<!-- Include the royal theme stylesheet -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/muds-darkmoon.min.css">

<!-- Create the editor container -->
<textarea id="editor"></textarea>

<!-- Include the MUDS library -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/muds.min.js"></script>

<!-- Initialize MUDS editor -->
<script>
var muds = new muds({
    selector: 'editor',
    theme: 'darkmoon'
});
</script>
                    







Royal theme


Download, or include the library https://cdn.jsdelivr.net/npm/[email protected]/muds-royal.min.css








<!-- Include the MUDS stylesheet -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/muds.min.css">

<!-- Include the royal theme stylesheet -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/muds-royal.min.css">

<!-- Create the editor container -->
<textarea id="editor"></textarea>

<!-- Include the MUDS library -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/muds.min.js"></script>

<!-- Initialize MUDS editor -->
<script>
var muds = new muds({
    selector: 'editor',
    theme: 'royal'
});
</script>
                    







Markee theme


Download, or include the library https://cdn.jsdelivr.net/npm/[email protected]/muds-markee.min.css








<!-- Include the MUDS stylesheet -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/muds.min.css">

<!-- Include the royal theme stylesheet -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/muds-markee.min.css">

<!-- Create the editor container -->
<textarea id="editor"></textarea>

<!-- Include the MUDS library -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/muds.min.js"></script>

<!-- Initialize MUDS editor -->
<script>
var muds = new muds({
    selector: 'editor',
    theme: 'markee'
});
</script>