Apply custom CSS and JavaScript to your
Articulate Rise courses automatically with our free Chrome extension.
Private by design. No sign-in. No tracking. Free forever.
Add our free Chrome extension for Articulate Rise customization—no registration or setup needed. Get started in seconds!
Add your CSS and JavaScript to take full control of your course’s look and behavior.
Publish your Rise course to any format (SCORM 1.2/2004, xAPI, Web, AICC, cmi5) and automatically apply all your custom CSS and JavaScript customizations to create a truly unique learning experience.
Watch how easy it is to apply custom CSS and JavaScript to all your Articulate Rise course formats.
Customize Rise courses with your own CSS. Instantly copy block IDs, add custom classes, and patch all Rise output formats—no sign-in, always private.
Unlock AI-powered code generation, explanation, and optimization features. Context-aware AI assistant helps you write better CSS and JavaScript faster—plus all Free features.
All AI-powered Pro features and updates at a discounted rate. Save 2 months with annual billing for continuous AI assistance.
| Feature | Free | Pro |
|---|---|---|
| AI Code Assistant Generate, Explain, and Optimize CSS & JavaScript Upgrade | — | |
| Built-in CSS Quick Editor Write custom CSS directly in Articulate Rise | ||
| Live Preview for CSS See your changes in real time in Rise's editor and preview New | ||
| Built-in JavaScript Quick Editor Edit JavaScript directly in Rise Editor | ||
| Copy Block IDs to Clipboard in Rise Editor Copy IDs instantly | ||
| Copy Block ID CSS Selectors to Clipboard in Rise Editor Copy selectors instantly New | ||
| Add Custom Classes to Blocks in Rise Editor Add classes for advanced styling | ||
| View Block HTML Structure in Rise Editor Inspect block markup New | ||
| Rise Course Patching Tool Supports SCORM 1.2/2004, xAPI, Web, AICC, cmi5 | ||
| Bulk Course Patching Up to 10 courses at once, all formats supported | ||
| Automatic Course Patching Patches automatically when publishing your course in any format | ||
| Advanced Code Editor Dedicated editor with tabs, JavaScript, built-in MDN tooltips | ||
Attach your own .css and .js files
Upgrade
|
— | |
| Edit SVGs Bonus Tool | ||
| Convert Subtitles Bonus Tool | ||
| Compress Images Bonus Tool | ||
| Batch Compress Images Up to 10 at once Upgrade | — | |
| Reflection Block Generator Bonus Tool |
Dive into our development process, discover new tips, and see what we're building next.
Learn how to precisely target and style any element in your Articulate Rise course using data-block-id—no coding experience required! This post covers what data-block-ids are, how to find them with the new RiseOverride toolbar button (with Copy Block ID and Add Class options), and how to use them for powerful, maintainable customizations. Includes copy-paste CSS and HTML examples, plus details on upcoming free features for all users.
Read the full guide →RiseOverride truly unlocks Articulate Rise and breaks the limitations of the default authoring tool. Add whatever you want using JavaScript and CSS to create experiences that were never possible before.
Go far beyond simple company branding. Create sophisticated eLearning solutions with advanced functionality that rivals custom-built learning platforms.
Unlock Rise's full potential with our free Chrome extension. Add Reflection Blocks, HTML5 gamification, and unlimited customization using JavaScript and CSS.
Unlock Rise's True Potential
