Source: https://mokxi.com/docs/editor/customize Updated: 2026-11-10 The editor # Customize: code themes, colors and the toolbar Pick one of 40 code themes and a font, wear the rings and editor colors you have earned, and choose the tools on the canvas toolbar. Open the editor All the docs ### Contents Start here The editor The sidebar and the editor's pages Placing parts Wiring Sticky notes Drawing on the canvas Tidying up Pinned comments Frames Schematic view PCB view Reusable blocks Chips made from parts Custom chips written in C The code editor and compiling Writing assembly Show an image on a MicroPython display Run and the serial monitor The serial plotter Operating point, sweeps and frequency response The logic analyzer tab The debugger Mokxi AI, Mokxi's helper The AI Builder WiFi, simulated Real internet Blynk, simulated Bluetooth, simulated ESP-NOW between boards The properties panel Undo, copy and paste Keyboard shortcuts Customize: code themes, colors and the toolbar Saving and autosave Sharing a project Embedding a circuit on another site Export and download Send a program to a real board VS Code and GitHub with Mokxi Run a prebuilt firmware SPICE netlists in Mokxi Working on a phone Install it as an app Boards Parts Accounts and plans Live collaboration Classrooms Lessons and the learning game Hobby builds Troubleshooting Reference Docs / The editor / Customize: code themes, colors and the toolbar Mokxi team ยท The editor Customize is at the foot of the editor's sidebar, at app.mokxi.com/customize. It has three tabs down its side: Look, Code editor and Toolbar. Signed in, every choice is saved to your account and follows you to every device. Your profile moved to Settings in 0.5.1: see your account. ## Look The Unlocks card: rings, editor colors and editor themes, earned by level, badges, streak and time on Mokxi. Pick the ring that shows around your picture and the editor color you want. With Level and badges switched on for your public page, your level and ring show there and on your gallery projects too. A class account's ring and colors are just for the student and never show in public. Signed out, the card still shows what you have unlocked in this browser, and a free account lets you wear them. See XP and levels for what unlocks each one. Where Mokxi AI is on, Look also has Chip walks around: now and then Chip hops out of the bubble and strolls along the bottom of the canvas. ## Code editor How the code pane looks: - Match my editor: one press sets the theme, font, size and spacing of VS Code, Arduino IDE, JetBrains, Xcode or Sublime Text. - Theme: 40 themes, grouped as Mokxi, VS Code, Arduino IDE, JetBrains, Xcode, Sublime Text and Popular themes. Find a theme or editor filters them as you type. - Font: System, SF Mono, Menlo, Consolas, Cascadia Code, JetBrains Mono, Fira Code, DejaVu Sans Mono or Courier New. A font your computer does not have falls back to the system one; nothing is downloaded. - Size: Editor default, or 10 to 24 px. - Line height: 1.3, 1.4, 1.5, 1.6, 1.8 or 2. - Ligatures, on or off, and Wrap long lines. - Reset to default puts back the editor as it ships. On Free, Mokxi's own theme, the system font and every size and spacing setting are yours. The other themes and fonts show as a preview marked Included with Pro, with See Pro. A child's account, a class account and a signed-out visitor see only what they can use, with no Pro items at all. A tip for long sessions: a dark theme with a slightly larger size and line height is easier on the eyes, and Match my editor makes Mokxi feel like the editor you already code in, so your muscle memory carries over. ## Toolbar Which tools sit on the round toolbar at the top left of the canvas. Run and More always stay. - The bar as it is: each pinned tool has Move left, Move right and Unpin, and you can drag them into a new order. - Every tool below it is a toggle that pins it to the bar or takes it off: Undo, Redo, Add, Copy, Paste, Duplicate, Fit, Zoom in, Zoom out, Rotate, Delete, Block, Chip, Code chip, Frame, Lock, Select all and more. - Up to 10 tools fit on the bar. At 10 the rest wait, and the page says why. - Reset to default brings back the usual bar: Undo, Redo, Add, Draw, Tidy, Layers, DC operating point and Checkup. The toolbar is free on every plan. Customize toolbar in the canvas's More menu opens the same settings right beside the bar. Related: the screen, part by part and keyboard shortcuts. Previous: Keyboard shortcuts Next: Saving and autosave ### On this page Look Code editor Toolbar ### Other guides Saving and autosave What the browser keeps, what the account keeps, and when each of them writes. Sharing a project The share sheet: who has access, what the link does, opening other people's projects, and the Embed and Clip rows. Embedding a circuit on another site Put a saved project, running, inside a blog post, a class site or a README, with the code from the share sheet's Embed row.