The UI kit in Vue and Angular
- @pxlkit/ui-kit-vue and @pxlkit/ui-kit-angularAddedAdded
Every component of the kit for Vue 3.5 and Angular 20–22: the same markup, classes and behaviour as React, verified example by example against it on mount, on the server, after hydration and after scripted interactions.
- @pxlkit/ui-kit-coreAddedAdded
The framework-neutral core the three kits share: design tokens, the Tailwind CSS v4 theme, class recipes, keyboard and date logic, focus trap, scroll lock and floating positioning.
- @pxlkit/vue, @pxlkit/angular and @pxlkit/core/vanillaAddedAdded
The icon, animated, parallax and toast components for Vue and Angular, on a React-free entry of @pxlkit/core that the icon packs now build on too.
- Docs and Storybooks in three frameworksAddedAdded
Every example on /docs and /ui-kit in React, Vue and Angular, and Storybooks for the Vue and Angular kits beside the React one, on Storybook 10.
- An API reference and a page for every componentAddedAdded
Every component has its own page under /docs/components with its props, events, slots and bindings in React, Vue and Angular, read from the kits' sources, next to its examples and accessibility notes.
- Decorative iconsAddedAdded
decorative on PxlKitIcon, AnimatedPxlKitIcon and ParallaxPxlKitIcon renders alt="" for an icon beside text that already says what it means, so screen readers skip it — in React, Vue and Angular.
- A heading level for the heroAddedAdded
PixelHeroSection takes as (h1–h6), and PixelGlitch takes label, so a glitch headline is one heading with its text once.
- Setup guides for every frameworkAddedAdded
The Tailwind CSS v4 build step for Next.js, Vite, Nuxt and Angular, the Next.js App Router, dark mode without a flash, fonts, server rendering and upgrading from 2.1, on /docs, /ui-kit and in the READMEs.
- A tree-shakeable, client-ready React kitChangedChanged
An app that imports one component bundles 6 KB of the kit instead of 362 KB, and every built file starts with 'use client', so Next.js Server Components render the kit directly.
- Pixel buttons without a doubled labelFixedFixed
The drop shadow on cut corners was clipped outside the button and, inside, drew a second copy of its label and border in the light theme. Pixel buttons keep their hover and press moves.
- Bold headlines on the linear surfaceFixedFixed
The hero headline, the section header title and the pricing amount render at 700, as intended: the display face's semibold won over them.
- Linear progress bars that stand outFixedFixed
PixelProgress on the linear surface filled its track with an 18% tint that stood out from it by only 1.2:1 to 1.5:1; it now fills with the tone's solid colour, as the pixel blocks do.
- Keyboard focus shows on the pixel surfaceFixedFixed
The cut corners clipped the focus ring, so most pixel controls showed no keyboard focus: they now light up their edge inside their corners, and focus also shows in high-contrast (forced-colors) mode.
- Server-rendered pages hydrate for every readerFixedFixed
For readers who prefer reduced motion, the first browser render read their preference and differed from the markup the server had sent, so the page failed to hydrate: useMediaQuery and useReducedMotion now start from their default while hydrating, in the three kits.
- Accessibility and behaviour fixes the ports surfacedFixedFixed
Focus moved into dialogs and pickers, menus and menu buttons on the WAI-ARIA patterns, the calendars on the date grid pattern, clickable table rows from the keyboard, announced toasts and loading states, and more — see CHANGELOG.md.