MyOshi Theme Lab
Build and test MyOshi Custom CSS/HTML against a sandboxed profile preview — templates included.
Runs locally in your browser. No accounts. No uploads. Saved snapshots are local to your browser.
Need help with your theme?
Join the Oshi-Lab group on MyOshi to ask questions, share ideas, and submit issues or feedback.
How it works
Read the guide →- Choose a starting pointStart from a built-in scaffold OR paste MyOshi preview HTML.Template scaffold Real preview + Extract Base
- Iterate in the LabEdit Custom CSS/HTML, checkpoint with snapshots, and verify in the sandboxed preview.
- Export + shipCopy/paste into MyOshi when you’re ready.
Quickstart
- Open the Lab → choose a template OR Paste preview HTML → click Extract Base.
- Edit Custom CSS/Custom HTML and preview.
- Use snapshots to checkpoint changes.
- Copy/paste into MyOshi or download your bundle.
Popular Docs
Theme Lab
How the lab works, previews, snapshots, exporting, and recommended patterns.
Getting Started
What this project is, where to click, and the fastest way to start styling.
How To - Get Preview HTML
How to get the rendered HTML from your MyOshi preview.
How To - Audit Your Custom Theme
How to use the auditing tools to audit your custom theme.
Tool - Accessibility Audit
Audit your theme for common accessibility issues (alt text, accessible names, contrast).
Tools Palette
In the Lab, open Tools (or press Ctrl/Cmd + K) to generate safer CSS/HTML faster.
- CSS Scope Fixer (MyOshi auto-scope safe)
- Accessibility Audit (alt/labels contrast checks)
- Theme Variables (quick palette presets)
- Component Styler (cards/nav/tabs/link styling)
- Schedule Builder (stream schedule markup)
- Color Converter (HEX/RGBA snippets)
Widgets
Insert pre-made HTML + CSS widgets (callouts, cards, Twitch buttons, schedule grids).
Widget - Info Card
Simple heading & content card. Great for “About”, “Rules”, “Credits”, etc.
Widget - Callout Box
A title + body callout with an optional link. Fully scoped to .labw-callout.
Widget - MyOshi Card (native-looking)
A native-looking card that reuses MyOshi’s built-in .card / .card-header / .card-body styles.
Widget - Notice Glow (native)
A native-looking “notice” strip that reuses the base template’s .notice-glow style.
Widget - Sparkle Divider (native)
A themed horizontal divider that matches the base template’s “sparkle” styling.
Widget - Streaming Schedule (Grid)
Responsive 7-day schedule grid. Fill each day with slots using the provided markup.
CSS Blocks
Drop in CSS chunks for common patterns.
Glassmorphism cards Background overlay Merge blurb borders
How to use CSS Blocks More Tools
Oshi Theme Lab is part of a collection of tools created by CrimsonStrife.
Oshi-Lab
Open-source toolkit for building MyOshi themes.
Streamer.live
CMS/Website App with Tools and integrations for streamers.
Forge
Project management app for game development.