Overview
Whether you’re working with live web apps or static assets, Walnut makes it easy to bring your content to life. You can import two core types of content with Walnut:
- HTML/CSS Content – Capture fully editable web content using the Walnut Chrome Extension.
- Non-HTML Content – Import static images, videos, and documents using the Screens Library, Playlists and Advanced Playlists, and Deal Rooms.
Capturing HTML & CSS Content
Walnut Chrome Extension 📸
The Walnut Chrome Extension is a Chrome-based browser extension that allows you to capture fully editable HTML & CSS-based web applications and other web content.
⚠️ Before Capturing:
Review Chrome Extension Capabilities & Best Practices to prevent sizing or layout issues and ensure clean, pixel-perfect results every time.
What Can I Capture?
-
Live web applications – production-level web apps built with HTML and CSS.
-
Staging and development environments – capture content hosted locally (e.g., localhost, Live Server) or in pre-production environments.
-
Standard web-based content – capture product pages, landing sites, internal tools, and other web-based content.
-
Figma designs – capture Figma to HTML exports with the Anima add-on. Learn more about the Anima Add-On here.
Key Features
- Editable post-capture: All HTML/CSS elements are fully editable and endlessly customizable in the Walnut Editor.
- Interactive flows: Use screen linking tools to simulate navigation (e.g., dropdown menus, multi-step flows)
- Easy update: Use the extension's Update Screen feature to easily transfer guide steps, screen links, and edits when your platform changes.
Importing Non-HTML Content
Walnut makes it easy to enhance your product experiences with non-HTML content using the Screens Library, Playlists & Advanced Playlists and Digital Sales Rooms (DSRs).
You can import the following file types and media formats:
- Static images (PNG, JPEG) and GIFs
- .mp4, .mov, or screen recordings (e.g., chat, mobile app flows, etc.)
- Video links from platforms like YouTube and Vimeo
- PDFs and Google Docs
File Size Limit: Individual uploaded files must be under 100MB.
Screens Library 📱
Use the Screens Library to import static assets. Combine template screens with HTML captures—or use them on their own—to craft dynamic, immersive demo experiences.
Where to Find It:
- Open an existing template or create a new template.
- If using an existing template, expand the Screens panel on the left side.
- Click the Add button at the bottom of the panel, or click the plus (+) icon at the top.
- If starting from a new template, click Browse existing demos when prompted.
- Click Add Screen.
- In the Insert Screens pop-up, go to the Screens Library tab.
- Select one or more template screens, then click Done to insert them into your template.
Learn More: Importing Screens With the Screens Library
Playlists & Advanced Playlists 🎧
Playlists and Advanced Playlists give you flexible ways to organize and deliver immersive, mixed-media product experiences tailored to every stage of the buyer journey.
Where to Find It:
- Log in to the Walnut app.
- Click the New button in the upper-right corner of your Library.
- Select Playlist from the dropdown menu.
- Choose Your Playlist Layout:
- Choose Your Own Adventure (Core)
- Sales Hub (Advanced)
- Customer Hub (Advanced)
Learn More:
Deal Rooms – Coming Soon! 🛋️
Walnut Deal Rooms introduce a powerful deal management experience designed to streamline how sales teams organize, track, and collaborate across the entire sales cycle.
The Deal Room provides a centralized hub for product-led selling—enabling rich product experiences from first touch to closed deal.
Where to Find It: Walnut Library, Deals
Learn More: Deal Rooms – Coming Soon! 🛋️