Widget
Three light animations, one line of HTML.
The anim widget gives any page of the site three light animations: blocks that appear when they scroll into view, numbers that count up to their value, and a sound wave drawn in the hero. One line of HTML connects it. When the reader asks for less motion, all of it stops.
A drawing of a speech waveform, not a recording. The canvas pauses when it scrolls out of sight.
One line to connect it
The line goes into the head of the page. The widget finds the blocks, the numbers and the wave by itself: no class to add, no attribute to set. The files have to be in the assets folder of the page. A page of the factory asks for the widget with one key in its data file, and the factory copies the files and puts the line in the head for it.
<link rel="stylesheet" href="assets/anim/anim.css"><script src="assets/anim/anim.js" defer></script>
The line is the same on every page of the site. The path is relative, so the page keeps working under any mount.
What it does
Blocks that arrive
A block below the fold waits with opacity 0 and a small shift, and appears when it scrolls into view. The text is in the DOM all the time; only the opacity and the transform change, so the page never jumps.
Numbers that count
An element with data-anim-count counts up to its value when it appears. The final value is written in the markup, so the page reads right without JavaScript and the search engines see the number.
A wave in the hero
A canvas of bars draws a speech-like waveform. It is under 5 KB of JavaScript, it pauses when it scrolls out of sight, and it draws one static frame when the reader asked for less motion.
The numbers it animates
Four numbers of our own service, taken from the service contract and the pricing page. The counters show them one by one.
Source: the service contract and the pricing page (apps/web/content/data/service.json), accessed 2026-10-22.
What one file may be
| What | Value | Where it comes from |
|---|---|---|
| Size of one file | 64 MB | Service contract |
| Length of one file | 120 minutes (two hours) | Service contract |
| Free plan | $0: 3 files a day, up to 30 minutes per file, no card | Pricing page |
| Pro fair use | 1,500 minutes of audio per calendar month | Pricing page |
| One file | the same limits on every plan | Service contract |
Source: the service contract and the pricing page (apps/web/content/data/service.json), accessed 2026-10-22.
The price, next to the market
What a month of a paid plan costs, billed yearly. Descript is read from its own pricing page; our price is from our pricing page.
Source: our pricing page (apps/web/content/data/service.json) and https://www.descript.com/pricing (read 21 October 2026), accessed 2026-10-22.
| Service | Plan | A month, billed yearly | Where it comes from |
|---|---|---|---|
| Transcrib Si | Pro | $10 | our pricing page |
| Descript | Hobbyist | $16 | descript.com/pricing |
| Descript | Creator | $24 | descript.com/pricing |
| Descript | Business | $50 | descript.com/pricing |
What a month of audio costs
The Pro plan gives 1,500 minutes of audio a calendar month. The price of a minute follows from that allowance and from the price of the plan. The arithmetic happens in the browser; nothing is sent anywhere.
- Pro, paid yearly ($10 a month): $0.80 for that many minutes
- Pro, paid monthly ($20 a month): $1.60 for the same minutes
- Files of 120 minutes that fit into the 1500 minutes of the month: 12
- The free plan gives 90 minutes a day: 3 files of up to 30 minutes
Source: the service contract and the pricing page (apps/web/content/data/service.json), accessed 2026-10-22.
Questions
Does the widget load anything from another site?
No. The files are in the assets folder of the site itself: no CDN, no web font, no library, no build step. The wave file is loaded only by the pages that ask for a wave, so a page without one does not pay for it.
What happens when the reader asks for less motion?
The blocks are shown at once, the numbers keep the value they have in the markup, and the wave draws one static frame and does not move. The setting is watched, so a reader who switches it while the page is open gets the same result.
Can the widget be used on a page of the factory?
Yes. One line in the head of the page and the files in the assets folder of that page. In the factory it is one key in the data file of the page; the build copies the files and puts the line in the head. The blocks of the factory, the cards and the steps of the how-to, are picked up without a single change in the template.