|
| 1 | +--- |
| 2 | +layout: blog |
| 3 | +meta: |
| 4 | + title: November 2025 Update |
| 5 | + description: November delivered Vuetify v3.11.0 with VCalendar and VHotkey promoted from labs, new VTimePicker input variant, VDatePicker MD3 improvements, and significant CLI progress. |
| 6 | + keywords: Vuetify November 2025, v3.11.0 Harbinger, VCalendar, VHotkey, VTimePicker, VDatePicker MD3 |
| 7 | +--- |
| 8 | + |
| 9 | +<script setup> |
| 10 | + import { useTheme } from 'vuetify' |
| 11 | + |
| 12 | + const theme = useTheme() |
| 13 | + const mcplogo = computed(() => { |
| 14 | + return `https://cdn.vuetifyjs.com/docs/images/one/logos/vmcp-logo-${theme.current.value.dark ? 'dark' : 'light'}.png` |
| 15 | + }) |
| 16 | + const zerologo = computed(() => { |
| 17 | + return `https://cdn.vuetifyjs.com/docs/images/one/logos/vzero-logo-${theme.current.value.dark ? 'dark' : 'light'}.png` |
| 18 | + }) |
| 19 | + const vuetifylogo = computed(() => { |
| 20 | + return `https://cdn.vuetifyjs.com/docs/images/one/logos/vuetify-logo-${theme.current.value.dark ? 'dark' : 'light'}.png` |
| 21 | + }) |
| 22 | +</script> |
| 23 | + |
| 24 | +# November 2025 Update |
| 25 | + |
| 26 | +Welcome to the November 2025 Vuetify update! This month marks a major milestone with the release of **v3.11.0 (Harbinger)**, promoting VCalendar and VHotkey from labs to core, introducing the new VTimePicker input variant, and aligning VDatePicker with Material Design 3 specifications. |
| 27 | + |
| 28 | + |
| 29 | + |
| 30 | +🖊️ John Leider • 📅 December 10th, 2025 |
| 31 | + |
| 32 | +<PromotedEntry /> |
| 33 | + |
| 34 | +--- |
| 35 | + |
| 36 | +## The Harbinger Arrives |
| 37 | + |
| 38 | +November was a landmark month for the framework. We shipped **v3.11.0 (Harbinger)** with two components graduating from labs—VCalendar and VHotkey—alongside significant enhancements to date and time pickers that bring them in line with Material Design 3. The **VTimePicker input variant** and **VDatePicker control alignment** represent months of refinement work finally landing in a stable release. Beyond the framework, we made substantial progress on the **Vuetify CLI** with 37 commits laying the groundwork for v0 tooling. J-Sek continued his incredible contribution streak, authoring 14 PRs to the main framework and adding 7+ new templates to Snips. The ecosystem is firing on all cylinders. |
| 39 | + |
| 40 | +::: success |
| 41 | + |
| 42 | +Cool example of the month: [v0 Expansion Panel in VPlay](https://vtfy.link/i5LxmQ) by [johnleider](https://github.com/johnleider) |
| 43 | + |
| 44 | +::: |
| 45 | + |
| 46 | +--- |
| 47 | + |
| 48 | +## Table of Contents |
| 49 | + |
| 50 | +* [Releases](#releases) |
| 51 | + * [Key Improvements](#key-improvements) |
| 52 | +* [Ecosystem Spotlight: Vuetify CLI](#ecosystem-spotlight-vuetify-cli) |
| 53 | +* [Framework Updates](#framework-updates) |
| 54 | + * [Date & Time Picker Enhancements](#date-time-picker-enhancements) |
| 55 | + * [Component Refinements](#component-refinements) |
| 56 | + * [In Development](#in-development) |
| 57 | +* [Vuetify MCP: Continued Evolution](#vuetify-mcp-continued-evolution) |
| 58 | +* [Vuetify0: Progress Update](#vuetify0-progress-update) |
| 59 | +* [November 2025 Changelog](#november-2025-changelog) |
| 60 | +* [What's Next](#whats-next) |
| 61 | + |
| 62 | +--- |
| 63 | + |
| 64 | +## Releases |
| 65 | + |
| 66 | +November delivered seven releases culminating in **v3.11.0 (Harbinger)**, our most feature-rich release since v3.10. Two components graduated from labs to core, and we shipped significant enhancements across date/time pickers, tabs, and overlay components. |
| 67 | + |
| 68 | + |
| 69 | + |
| 70 | +### Key Improvements |
| 71 | + |
| 72 | +* **VCalendar** and **VHotkey** promoted from labs to core components |
| 73 | +* New **VTimePicker input variant** for inline time entry without the dial interface |
| 74 | +* **VDatePicker MD3 alignment** with updated control variants matching Material Design 3 specifications |
| 75 | +* **VTabs inset prop** for subtle tab designs in dense layouts |
| 76 | +* **VTextarea max-height prop** for controlled textarea growth |
| 77 | +* **VSelect auto-select-first** for automatic first-item highlighting |
| 78 | +* Theme **layers option** for advanced CSS cascade control |
| 79 | + |
| 80 | +View the complete list of changes in the [Full Changelog](#november-2025-changelog) |
| 81 | + |
| 82 | +**Details:** |
| 83 | + |
| 84 | +* [v3.10.9](https://vuetifyjs.com/getting-started/release-notes/?version=v3.10.9) |
| 85 | +* [v3.10.10](https://vuetifyjs.com/getting-started/release-notes/?version=v3.10.10) |
| 86 | +* [v3.10.11](https://vuetifyjs.com/getting-started/release-notes/?version=v3.10.11) |
| 87 | +* [v3.10.12](https://vuetifyjs.com/getting-started/release-notes/?version=v3.10.12) |
| 88 | +* [v3.11.0](https://vuetifyjs.com/getting-started/release-notes/?version=v3.11.0) |
| 89 | + |
| 90 | +--- |
| 91 | + |
| 92 | +## Ecosystem Spotlight: Vuetify CLI |
| 93 | + |
| 94 | +November saw intensive development on the **Vuetify CLI**, with 37 commits laying the foundation for v0 tooling and developer workflows. While not yet released, this work represents a significant investment in the developer experience for Vuetify 4.0 and beyond. |
| 95 | + |
| 96 | +The CLI will provide streamlined project scaffolding, component generation, and integration with the broader Vuetify ecosystem including v0 composables and the MCP server. More details coming as we approach the initial release. |
| 97 | + |
| 98 | +**Also this month:** |
| 99 | + |
| 100 | +* **Vuetify Bin** received real-time collaboration features |
| 101 | +* **Vuetify Snips** added 7+ new templates across pricing, buttons, feedback cards, and chat components |
| 102 | +* **Vuetify Play** and **Studio** improved user preference persistence |
| 103 | + |
| 104 | +**Details:** |
| 105 | + |
| 106 | +* [Vuetify Bin](https://bin.vuetifyjs.com/) |
| 107 | +* [Vuetify Snips](https://snips.vuetifyjs.com/) |
| 108 | +* [Vuetify Play](https://play.vuetifyjs.com/) |
| 109 | + |
| 110 | +--- |
| 111 | + |
| 112 | +## Framework Updates |
| 113 | + |
| 114 | +<AppFigure :src="vuetifylogo" alt="Vuetify logo" width="200" height="auto" class="mx-auto my-4" title="Vuetify Logo" /> |
| 115 | + |
| 116 | +November's framework work centered on date/time picker improvements and component polish. J-Sek delivered an outstanding 14 PRs, driving many of the enhancements below. |
| 117 | + |
| 118 | +### Date & Time Picker Enhancements |
| 119 | + |
| 120 | +The date and time picker components received significant attention this month, bringing them closer to Material Design 3 specifications and adding long-requested features. |
| 121 | + |
| 122 | +**VTimePicker Input Variant** |
| 123 | + |
| 124 | +A new input variant allows users to type time values directly without using the dial interface—perfect for power users and keyboard-first workflows. |
| 125 | + |
| 126 | + |
| 127 | + |
| 128 | +**VDatePicker MD3 Controls** |
| 129 | + |
| 130 | +Control variants have been aligned with Material Design 3, providing a more polished and consistent appearance. |
| 131 | + |
| 132 | +<!-- replace height with auto before releasing --> |
| 133 | +<video width="100%" height="300" loop controls class="mb-4"> |
| 134 | + <source src="https://cdn.vuetifyjs.com/docs/images/blog/november-2025-update/vdatepicker-md3.mp4" type="video/mp4"></source> |
| 135 | +</video> |
| 136 | + |
| 137 | +**Details:** |
| 138 | + |
| 139 | +* [VTimePicker input variant PR#21601](https://github.com/vuetifyjs/vuetify/pull/21601) |
| 140 | +* [VDatePicker MD3 alignment PR#21589](https://github.com/vuetifyjs/vuetify/pull/21589) |
| 141 | +* [VDatePicker landscape mode PR#22305](https://github.com/vuetifyjs/vuetify/pull/22305) |
| 142 | +* [VDateInput min/max fix PR#22295](https://github.com/vuetifyjs/vuetify/pull/22295) |
| 143 | + |
| 144 | +### Component Refinements |
| 145 | + |
| 146 | +**Navigation & Layout** |
| 147 | + |
| 148 | +* **VTabs**: New `inset` prop for subtle tab designs, plus slider transition improvements |
| 149 | +* **VOverlay**: Added `viewport-margin` prop for better positioning control |
| 150 | +* **VNavigationDrawer**: New `retain-focus` prop to control focus behavior |
| 151 | + |
| 152 | +<!-- replace height with auto before releasing --> |
| 153 | +<video width="100%" height="300" loop controls class="mb-4"> |
| 154 | + <source src="https://cdn.vuetifyjs.com/docs/images/blog/november-2025-update/vtabs-slider.mp4" type="video/mp4"></source> |
| 155 | +</video> |
| 156 | + |
| 157 | +**Form Components** |
| 158 | + |
| 159 | +* **VTextarea**: Added `max-height` prop for controlled growth |
| 160 | +* **VSelect**: New `auto-select-first` prop and improved chip itemProps handling |
| 161 | +* **VCombobox**: Create new items when pasting with line breaks |
| 162 | + |
| 163 | +**Data & Display** |
| 164 | + |
| 165 | +* **VTreeview**: Significant performance improvements for large trees |
| 166 | +* **VList**: New `prepend-gap` and `indent` props for flexible spacing |
| 167 | +* **VBreadcrumbs**: Props and width can now be passed to items |
| 168 | + |
| 169 | +**Theming** |
| 170 | + |
| 171 | +* New `layers` option for advanced CSS cascade control |
| 172 | + |
| 173 | +**Details:** |
| 174 | + |
| 175 | +* [VTabs inset PR#22221](https://github.com/vuetifyjs/vuetify/pull/22221) |
| 176 | +* [VTabs slider transition PR#19556](https://github.com/vuetifyjs/vuetify/pull/19556) |
| 177 | +* [VOverlay viewport-margin PR#22243](https://github.com/vuetifyjs/vuetify/pull/22243) |
| 178 | +* [VNavigationDrawer retain-focus PR#22106](https://github.com/vuetifyjs/vuetify/pull/22106) |
| 179 | +* [VTextarea max-height PR#22286](https://github.com/vuetifyjs/vuetify/pull/22286) |
| 180 | +* [VSelect auto-select-first PR#22312](https://github.com/vuetifyjs/vuetify/pull/22312) |
| 181 | +* [VCombobox line breaks PR#22304](https://github.com/vuetifyjs/vuetify/pull/22304) |
| 182 | +* [VTreeview performance PR#22255](https://github.com/vuetifyjs/vuetify/pull/22255) |
| 183 | +* [VList prepend-gap/indent PR#20616](https://github.com/vuetifyjs/vuetify/pull/20616) |
| 184 | +* [VBreadcrumbs props PR#22213](https://github.com/vuetifyjs/vuetify/pull/22213) |
| 185 | +* [Theme layers PR#22215](https://github.com/vuetifyjs/vuetify/pull/22215) |
| 186 | + |
| 187 | +--- |
| 188 | + |
| 189 | +## Vuetify MCP: Continued Evolution |
| 190 | + |
| 191 | +<AppFigure :src="mcplogo" alt="Vuetify MCP logo" width="200" height="auto" class="mx-auto my-4" title="Vuetify MCP Logo" /> |
| 192 | + |
| 193 | +November brought four releases to the Vuetify MCP server (v0.2.0 through v0.2.3), continuing to refine the AI-powered development experience. |
| 194 | + |
| 195 | +### What's New |
| 196 | + |
| 197 | +**Stability Improvements**: Multiple releases focused on reliability and edge case handling for the HTTP transport introduced in October. |
| 198 | + |
| 199 | +**Documentation Enhancements**: Improved tool descriptions and response formatting for better AI assistant integration. |
| 200 | + |
| 201 | +### Getting Started |
| 202 | + |
| 203 | +To use the hosted MCP server with Claude Desktop or other MCP clients: |
| 204 | + |
| 205 | +```json |
| 206 | +{ |
| 207 | + "mcpServers": { |
| 208 | + "vuetify": { |
| 209 | + "url": "https://mcp.vuetifyjs.com/mcp" |
| 210 | + } |
| 211 | + } |
| 212 | +} |
| 213 | +``` |
| 214 | + |
| 215 | +**Details:** |
| 216 | + |
| 217 | +* [Vuetify MCP GitHub Repository](https://github.com/vuetifyjs/mcp) |
| 218 | +* [Model Context Protocol Documentation](https://modelcontextprotocol.io/) |
| 219 | + |
| 220 | +--- |
| 221 | + |
| 222 | +## Vuetify0: Progress Update |
| 223 | + |
| 224 | +<AppFigure :src="zerologo" alt="Vuetify0 logo" width="200" height="auto" class="mx-auto my-4" title="Vuetify0 Logo" /> |
| 225 | + |
| 226 | +November was our most active month yet for Vuetify0, with 109 commits and 5 releases (v0.0.10 through v0.0.14). The focus was on performance optimization and type safety improvements. |
| 227 | + |
| 228 | + |
| 229 | + |
| 230 | +**Performance Optimizations** |
| 231 | + |
| 232 | +We implemented deferred reindexing for registry unregister operations, significantly improving performance when components mount and unmount rapidly. |
| 233 | + |
| 234 | +**Type Safety Improvements** |
| 235 | + |
| 236 | +The `RegistryTicket.value` is now generic, providing better type inference and IntelliSense support when working with registered items. |
| 237 | + |
| 238 | +```ts |
| 239 | +import { useRegistry } from '@vuetify/v0' |
| 240 | +import type { RegistryTicket } from '@vuetify/v0' |
| 241 | + |
| 242 | +interface User { |
| 243 | + name: string |
| 244 | + email: string |
| 245 | +} |
| 246 | + |
| 247 | +// Value type flows through the registry |
| 248 | +const registry = useRegistry<RegistryTicket<User>>() |
| 249 | + |
| 250 | +const ticket = registry.register({ |
| 251 | + id: 'user-1', |
| 252 | + value: { name: 'John', email: 'john@vuetifyjs.com' } |
| 253 | +}) |
| 254 | + |
| 255 | +// ticket.value is typed as User |
| 256 | +console.log(ticket.value.name) // ✓ TypeScript knows this is a string |
| 257 | +``` |
| 258 | + |
| 259 | +December will focus on expanding the component library and preparing integration paths with the main Vuetify framework. |
| 260 | + |
| 261 | +**Details:** |
| 262 | + |
| 263 | +* [Vuetify0 Documentation](https://0.vuetifyjs.com/) |
| 264 | +* [Performance optimization PR#48](https://github.com/vuetifyjs/0/pull/48) |
| 265 | +* [Type safety PR#53](https://github.com/vuetifyjs/0/pull/53) |
| 266 | + |
| 267 | +--- |
| 268 | + |
| 269 | +## November 2025 Changelog |
| 270 | + |
| 271 | +The following section provides an overview of the changes made in November 2025, including new features, bug fixes, and enhancements across the Vuetify framework. |
| 272 | + |
| 273 | +**Key Improvements:** |
| 274 | + |
| 275 | +* VCalendar and VHotkey promoted from labs to core |
| 276 | +* VTimePicker input variant for direct time entry |
| 277 | +* VDatePicker MD3 control alignment |
| 278 | +* VTabs inset prop and slider transitions |
| 279 | +* VTreeview performance optimizations for large trees |
| 280 | +* Theme layers option for CSS cascade control |
| 281 | + |
| 282 | +**Expand** this section to see the detailed changelog for November 2025: |
| 283 | + |
| 284 | +<details> |
| 285 | + |
| 286 | +### :rocket: Features |
| 287 | + |
| 288 | +* **flex:** add justify-items utilities ([#22346](https://github.com/vuetifyjs/vuetify/issues/22346)) ([pgalhardo](https://github.com/pgalhardo)) |
| 289 | +* **VBreadcrumbs:** pass props and width to items ([#22213](https://github.com/vuetifyjs/vuetify/issues/22213)) ([J-Sek](https://github.com/J-Sek)) |
| 290 | +* **VCombobox:** create new items when pasting with line breaks ([#22304](https://github.com/vuetifyjs/vuetify/issues/22304)) ([ikushum](https://github.com/ikushum)) |
| 291 | +* **VDatePicker:** align control variants with MD3 ([#21589](https://github.com/vuetifyjs/vuetify/issues/21589)) ([J-Sek](https://github.com/J-Sek)) |
| 292 | +* **VList:** add `prepend-gap` and `indent` props ([#20616](https://github.com/vuetifyjs/vuetify/issues/20616)) ([yuwu9145](https://github.com/yuwu9145)) |
| 293 | +* **VNavigationDrawer, VOverlay:** add `retain-focus` prop ([#22106](https://github.com/vuetifyjs/vuetify/issues/22106)) ([J-Sek](https://github.com/J-Sek)) |
| 294 | +* **VOverlay:** add `viewport-margin` prop ([#22243](https://github.com/vuetifyjs/vuetify/issues/22243)) ([J-Sek](https://github.com/J-Sek)) |
| 295 | +* **VSelect:** add `auto-select-first` prop ([#22312](https://github.com/vuetifyjs/vuetify/issues/22312)) ([J-Sek](https://github.com/J-Sek)) |
| 296 | +* **VSelect:** apply compatible itemProps to chips ([#22339](https://github.com/vuetifyjs/vuetify/issues/22339)) ([KaelWD](https://github.com/KaelWD)) |
| 297 | +* **VStepper:** add new item-props prop ([#20651](https://github.com/vuetifyjs/vuetify/issues/20651)) ([johnleider](https://github.com/johnleider)) |
| 298 | +* **VTabs:** add `inset` prop ([#22221](https://github.com/vuetifyjs/vuetify/issues/22221)) ([J-Sek](https://github.com/J-Sek)) |
| 299 | +* **VTabs:** add new prop, slider transition ([#19556](https://github.com/vuetifyjs/vuetify/issues/19556)) ([johnleider](https://github.com/johnleider)) |
| 300 | +* **VTextarea:** add `max-height` prop ([#22286](https://github.com/vuetifyjs/vuetify/issues/22286)) ([J-Sek](https://github.com/J-Sek)) |
| 301 | +* **VTimePicker:** input variant ([#21601](https://github.com/vuetifyjs/vuetify/issues/21601)) ([J-Sek](https://github.com/J-Sek)) |
| 302 | +* **theme:** add layers option ([#22215](https://github.com/vuetifyjs/vuetify/issues/22215)) ([Niki2k1](https://github.com/Niki2k1)) |
| 303 | +* **typography:** add font-weight semibold helper class ([#20586](https://github.com/vuetifyjs/vuetify/issues/20586)) ([FraCata00](https://github.com/FraCata00)) |
| 304 | + |
| 305 | +### :wrench: Bug Fixes |
| 306 | + |
| 307 | +* **v-tooltip:** prevent showing empty tooltip ([#22347](https://github.com/vuetifyjs/vuetify/issues/22347)) ([Haviles04](https://github.com/Haviles04)) |
| 308 | +* **VAvatar:** update background variable to use RGB format ([#22310](https://github.com/vuetifyjs/vuetify/issues/22310)) ([juanjcardona13](https://github.com/juanjcardona13)) |
| 309 | +* **VBtnToggle:** remove semicolon from Sass ([#22293](https://github.com/vuetifyjs/vuetify/issues/22293)) ([methompson](https://github.com/methompson)) |
| 310 | +* **VBtnToggle:** render selected in forced-colors mode ([#22279](https://github.com/vuetifyjs/vuetify/issues/22279)) ([06b](https://github.com/06b)) |
| 311 | +* **VCalendar:** calculate week numbers using current locale ([#22341](https://github.com/vuetifyjs/vuetify/issues/22341)) ([J-Sek](https://github.com/J-Sek)) |
| 312 | +* **VCalendar:** correct interval and event offset with custom firstTime ([#22343](https://github.com/vuetifyjs/vuetify/issues/22343)) ([KaelWD](https://github.com/KaelWD)) |
| 313 | +* **VCalendar:** day button font size and no active state ([#22336](https://github.com/vuetifyjs/vuetify/issues/22336)) ([J-Sek](https://github.com/J-Sek)) |
| 314 | +* **VDateInput:** min/max with built-in adapter ([#22295](https://github.com/vuetifyjs/vuetify/issues/22295)) ([J-Sek](https://github.com/J-Sek)) |
| 315 | +* **VDatePicker:** support landscape mode ([#22305](https://github.com/vuetifyjs/vuetify/issues/22305)) ([ikushum](https://github.com/ikushum)) |
| 316 | +* **VField:** hide progress border in forced-colors mode ([#22316](https://github.com/vuetifyjs/vuetify/issues/22316)) ([06b](https://github.com/06b)) |
| 317 | +* **VField:** remove details prop from makeVFieldProps ([#22268](https://github.com/vuetifyjs/vuetify/issues/22268)) ([pgalhardo](https://github.com/pgalhardo)) |
| 318 | +* **VHotkey:** inline alignment, sizing consistency, slash separator ([#22321](https://github.com/vuetifyjs/vuetify/issues/22321)) ([J-Sek](https://github.com/J-Sek)) |
| 319 | +* **VInfiniteScroll:** hide side element when empty ([#21749](https://github.com/vuetifyjs/vuetify/issues/21749)) ([J-Sek](https://github.com/J-Sek)) |
| 320 | +* **VList:** correct styles for spacing with `nav` prop ([#22254](https://github.com/vuetifyjs/vuetify/issues/22254)) ([J-Sek](https://github.com/J-Sek)) |
| 321 | +* **VMaskInput:** Fixes error when mask input is cleared ([#22176](https://github.com/vuetifyjs/vuetify/issues/22176)) ([ikushum](https://github.com/ikushum)) |
| 322 | +* **VRating:** correct keyboard controls ([#22314](https://github.com/vuetifyjs/vuetify/issues/22314)) ([J-Sek](https://github.com/J-Sek)) |
| 323 | +* **VSelect:** Use hidden select for native form submissions ([#22330](https://github.com/vuetifyjs/vuetify/issues/22330)) ([ikushum](https://github.com/ikushum)) |
| 324 | +* **VTab:** render selected in forced-colors mode ([#22271](https://github.com/vuetifyjs/vuetify/issues/22271)) ([06b](https://github.com/06b)) |
| 325 | +* **VTreeview:** faster interactions with large trees ([#22255](https://github.com/vuetifyjs/vuetify/issues/22255)) ([J-Sek](https://github.com/J-Sek)) |
| 326 | + |
| 327 | +### :test_tube: Labs |
| 328 | + |
| 329 | +* **VCalendar:** promoted to core component |
| 330 | +* **VHotkey:** promoted to core component |
| 331 | + |
| 332 | +</details> |
| 333 | + |
| 334 | +## What's Next{ .mt-4 } |
| 335 | + |
| 336 | +December will see continued refinement of v3.11.x as we stabilize the new features and address community feedback. Work on VCommandPalette progresses toward an initial labs release, and we're expanding the v0 library with additional headless primitives. |
| 337 | + |
| 338 | +The Vuetify CLI is approaching its first public release, which will streamline project setup and component generation for both Vuetify 3 and the upcoming v0-based workflows. We're also planning end-of-year webinars covering the v3.11 release highlights and a preview of what's coming in 2026. |
| 339 | + |
| 340 | +Thank you for being part of the Vuetify community. See you in December! |
| 341 | + |
| 342 | +--- |
| 343 | + |
| 344 | +*Stay connected with Vuetify updates through our [GitHub repository](https://github.com/vuetifyjs/vuetify), [Discord community](https://discord.gg/vuetify), and follow [@vuetifyjs](https://twitter.com/vuetifyjs) for the latest announcements. The best is yet to come!* |
0 commit comments