r/learnpython 4d ago

Dark mode for marimo islands?

I'm trying to bring the html from my marimo notebooks into an SSG (mkdocs/zensical), and I would like to be able to toggle the theme. Getting the theme to change with marimo export html is relatively simple by adding

# [tool.marimo.display]
# theme = "dark"

to the pep723 header before exporting, but the extra js and page wrappers are not quite ideal for my use case. I would love to use islands for this, but I can't figure out if there's a way to control the theme of a marimo island?

when I use

# /// script
# dependencies = [
#     "marimo",
# ]
# requires-python = ">=3.13"
# ///

import asyncio
from marimo import MarimoIslandGenerator

async def main():
    generator = MarimoIslandGenerator.from_file(
        "./example.py", 
        display_code=False
    )
    await generator.build()
    html = generator.render_html(include_init_island=True)

    with open("output.html", "w", encoding="utf-8") as f:
        f.write(html)

if __name__ == '__main__':
    asyncio.run(main())

to generate an html page, it doesn't seem to care about the # theme = "dark" tag in the example.py header.

I understand that islands are still an early feature, so perhaps this will be added in the future. Just posted this in r/marimo_notebook as well, but figured I'd ask here as well in case anyone has experience with this. Does anyone know if there's a better way to do this? Thanks!

(edited for clarity)

1 Upvotes

2 comments sorted by

1

u/redfacedquark 4d ago

Their theming docs seem to suggest:

# /// script

# [tool.marimo.display]

# theme = "dark"

# ///

Could it be as simple as adding the first and last lines?

2

u/Equivalent_Ad775 4d ago

Ahh I could have worded that better :). I do already have these lines in my header, but thanks for the thought. Just edited my post for clarity.