Q1 2026 was one of the busiest quarters we've had, as we shipped two new components, a full rich text editor composition, and finally automated the v2 to v3 migration.
Here's a quick overview at what landed between January and March.
Rich Text Editor (v3.31 · January)
A rich text editor is one of the most crucial components when building a blog app, note app or content management system. However, building one from scratch is quite hard.
In January, we rolled out a complete Rich Text Editor composition built on top of Tiptap.
npx @chakra-ui/cli snippet add rich-text-editorMarquee (v3.32 · February)
The next big addition of the year was Marquee which allows for infinite scrolling content. For example, testimonial walls, logo clouds, announcement banners, news tickers.
pauseOnInteraction stops the animation when a user hovers or focuses something
inside, which matters if you're scrolling testimonials or links that people
might actually want to read.
v2 → v3 Codemod (v3.32 · February)
In our February release, we also launched @chakra-ui/codemod, a package with 50+ automated transforms for upgrading from Chakra UI v2 to v3.
npx @chakra-ui/codemod upgradeThe codemod covers:
- Component renames
- Prop changes
- Theme migration
- Import updates component
- TypeScript system types
If you're on v2, this is a good time to try the codemod. Before running it, make
sure your git tree is clean. Use --dry to preview the output without touching
files.
DatePicker (v3.34 · March)
Before this quarter, you had to wire up Date Pickers from other libraries, but not anymore! March brought our biggest component release yet: the DatePicker, our most-requested component.
Our Date Picker covers keyboard navigation through a calendar grid, locale-aware formatting, range selection that handles "click start, click end" interaction, unavailable dates, min/max constraints, popover positioning, form integration, and more.
| S | M | T | W | T | F | S |
|---|---|---|---|---|---|---|
29 | 30 | 31 | 1 | 2 | 3 | 4 |
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 1 | 2 |
Jan | Feb | Mar | Apr |
May | Jun | Jul | Aug |
Sep | Oct | Nov | Dec |
2020 | 2021 | 2022 | 2023 |
2024 | 2025 | 2026 | 2027 |
2028 | 2029 |
Calendar standalone
If you want the calendar inline (not inside a popover), check out the Calendar component. It's the same engine as DatePicker but renders directly in the page. This pattern is useful for dashboards or full-page booking UIs.
| S | M | T | W | T | F | S |
|---|---|---|---|---|---|---|
29 | 30 | 31 | 1 | 2 | 3 | 4 |
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 1 | 2 |
Jan | Feb | Mar | Apr |
May | Jun | Jul | Aug |
Sep | Oct | Nov | Dec |
2020 | 2021 | 2022 | 2023 |
2024 | 2025 | 2026 | 2027 |
2028 | 2029 |
Community Highlight
It means a lot when developers take a moment to share their experience. This one is from @wirtzdan.
If you're building something with Chakra UI, we'd love to see it. Share your work on Discord or tag us on X.
Q2 in Motion
Q2 is already in motion and we've got some new components in the pipeline. Your community feedback is always valuable, so if you have something you've been waiting on, check the GitHub discussions or drop into our Discord server.