RetroUI 2.0 est là - plus grand, plus audacieux, plus complet

On a construit dans l’ombre pendant des mois. Aujourd’hui, on allume la lumière.

RetroUI 2.0 est là, et c’est la plus grosse mise à jour qu’on ait jamais livrée. Ce n’est pas un simple changement de numéro de version : c’est une refonte complète de ce que RetroUI sait faire et de la manière dont vous l’utilisez.

Au lancement de RetroUI, l’objectif tenait en une phrase : donner aux développeurs une bibliothèque d’interface qui ne ressemble à rien d’autre. Des designs qui ont du caractère, une esthétique néo-brutaliste, des composants qui font sortir vos projets du lot. Cette vision n’a pas bougé d’un pouce. Mais notre façon de la concrétiser ? Elle a franchi un cap.

Entrons dans le vif du sujet.

🎨 Prise en charge de Base UI - les fondations que vous réclamiez

Depuis le premier jour, c’est l’une des demandes qui revient le plus souvent : la prise en charge de Base UI. Elle est enfin là.

Base UI, c’est quoi ?

Base UI est une bibliothèque de composants React accessibles et sans style, développée par l’équipe de MUI. Voyez-la comme l’alternative headless et agnostique à Material UI : vous récupérez tout le comportement et toute la logique d’accessibilité, sans aucun parti pris visuel.

Pourquoi c’est décisif pour RetroUI

Jusqu’ici, les composants RetroUI reposaient sur les primitives de Radix UI (excellentes, entendons-nous bien). Mais Base UI ouvre de nouvelles portes :

• Souplesse côté framework : Base UI s’intègre sans friction dans React, Next.js et les autres frameworks modernes
• Meilleur tree-shaking : des bundles plus légers grâce à une optimisation affinée
• Accessibilité renforcée : les primitives d’accessibilité de Base UI sont éprouvées et conformes aux WCAG dès l’installation
• Une architecture pérenne : pensée pour les React Server Components et l’écosystème React moderne

Concrètement, qu’est-ce que ça change pour vous ? Les composants RetroUI sont désormais plus performants, plus accessibles et plus souples que jamais. Le tout sans rien lâcher sur le langage visuel affirmé que vous aimez.

Copier// Now powered by Base UI under the hood
import { Button } from "@/components/neobrutalism"
 
;<Button variant="primary">Still bold. Still RetroUI. Now even better.</Button>

🌐 Un seul site, une seule vision - OS et Pro réunis

Voilà ce qui nous chagrinait : maintenir deux sites distincts pour RetroUI OS (gratuit) et RetroUI Pro, ça sonnait… fragmenté. Comme si on divisait notre communauté au lieu de la rassembler.

C’est terminé.

Un site entièrement repensé

On a reconstruit tout le site RetroUI de zéro, en fondant OS et Pro dans une expérience d’un seul tenant. Voici les nouveautés :

Une bibliothèque de composants unifiée

Parcourez tous les composants, gratuits comme pro, au même endroit. Fini les allers-retours entre deux sites pour savoir ce qui existe. Tout est clairement identifié : vous voyez d’un coup d’œil ce qui est gratuit et ce qui est premium.

Une navigation plus limpide

Trouver ce dont vous avez besoin est plus rapide et plus intuitif. Composants, blocks, templates, docs : chaque chose a sa place logique.

Un design plus soigné

On applique à nous-mêmes ce qu’on prône. Le nouveau site est plus affirmé, plus rapide, plus abouti. C’est une vitrine de ce que RetroUI permet quand on assume l’esthétique jusqu’au bout.

Une meilleure expérience mobile

L’ancien site fonctionnait sur mobile. Le nouveau y brille. Un responsive fait dans les règles de l’art, avec des interactions tactiles qui semblent natives.

Et le meilleur ? Tout tourne avec des composants RetroUI. On mange notre propre cuisine : chaque composant que vous voyez sur le site est un composant que vous pouvez réutiliser dans vos projets.

📚 Une documentation qui vous fait vraiment gagner du temps

Soyons honnêtes : la documentation passe trop souvent au second plan. Pas cette fois.

On a entièrement revu les docs de RetroUI, avec des fonctionnalités qui vous simplifient la vie :

Copier en Markdown

Vous rédigez la documentation de votre propre projet ? Vous écrivez un article sur RetroUI ? Vous pouvez désormais copier le code d’un composant en Markdown d’un seul clic.

Idéal pour :

• Rédiger la documentation de vos composants
• Écrire des tutoriels et des guides
• Partager des exemples de code dans des outils qui reposent sur le Markdown (Notion, GitHub, etc.)

Une documentation dopée à l’IA

On a intégré une assistance par IA directement dans les docs. Une question sur la personnalisation d’un composant ? Besoin de comprendre l’API ? L’IA vous aide à trouver la réponse bien plus vite qu’en parcourant des pages entières de documentation.

Voici le genre de questions que vous pouvez poser :

• « Comment faire pour que le composant Button utilise des couleurs personnalisées ? »
• « Quelles props le composant Card accepte-t-il ? »
• « Montre-moi des exemples d’utilisation de la Modal avec des formulaires »

C’est comme avoir un expert RetroUI à portée de main, 24 h/24.

Des exemples de code améliorés

Chaque composant dispose maintenant de :

• Aperçus interactifs avec lesquels vous pouvez jouer
• Plusieurs variantes qui illustrent différents cas d’usage
• Du code prêt à coller avec les bons imports
• Des exemples TypeScript pour un typage plus sûr
• Des notes d’accessibilité qui expliquent comment chaque composant gère l’a11y

Fini les devinettes. Fini les plongées dans le code source. Juste des exemples clairs et utiles qui vous font avancer plus vite.

🧱 Plus de 100 nouveaux blocks - construisez plus vite que jamais

Les composants, c’est formidable. Mais parfois, il vous faut des sections entières, pas seulement des boutons et des cartes.

C’est là que les blocks entrent en scène.

Un block, c’est quoi ?

Les blocks sont des sections prêtes à l’emploi que vous déposez dans votre projet : sections héros, tableaux de tarifs, grilles de fonctionnalités, témoignages, appels à l’action, et bien plus. Ils sont entièrement responsives, accessibles et prêts à personnaliser.

Quoi de neuf dans la 2.0 ?

On a ajouté plus de 100 nouveaux blocks dans toutes les catégories imaginables :

Sections héros

• Plus de 15 nouvelles variantes de héros, du minimaliste au pleine largeur
• Arrière-plans animés, mises en page en écran partagé et héros vidéo inclus

Fonctionnalités et bénéfices

• Grilles de fonctionnalités à base d’icônes
• Mises en avant par captures d’écran
• Guides pas à pas
• Tableaux comparatifs

Tableaux de tarifs

• Des mises en page simples à deux colonnes jusqu’aux grilles tarifaires complexes à quatre paliers
• Bascule de facturation (mensuelle/annuelle)
• Matrices de comparaison des fonctionnalités

Témoignages

• Grilles, carrousels et mises en page en mosaïque
• Témoignages vidéo
• Murs de logos pour asseoir votre crédibilité

Appels à l’action et conversions

• Inscriptions à la newsletter
• Formulaires de liste d’attente
• Sections de téléchargement d’application
• Formulaires de contact qui ont du caractère

En-têtes et navigation

• Méga-menus
• Modèles de navigation pensés mobile d’abord
• En-têtes fixes avec effets au défilement

Pieds de page

• Pieds de page multicolonnes
• Pieds de page minimalistes sur une seule ligne
• Pieds de page intégrant la newsletter

Chaque block est bâti selon la même esthétique RetroUI affirmée : bordures épaisses, ombres franches, couleurs vives et compositions asymétriques. Ils sont conçus pour marquer les esprits, pas pour se fondre dans le décor.

Copier// Drop in a complete hero section in seconds
import { HeroBold } from "@/components/blocks"
 
;<HeroBold
  title="Your Product Name"
  subtitle="Ship faster with bold design"
  cta="Get Started"
/>

🌙 Nouveau template : dashboard d’outil dev en mode sombre

Les templates, c’est là que tout converge : composants, blocks et philosophie de design réunis dans une application complète.

Découvrez notre tout dernier template : le Dark Mode Dev Tool Dashboard.

De quoi s’agit-il ?

Un dashboard complet, pensé mode sombre d’abord, taillé pour les outils de développement, les plateformes SaaS et les back-offices d’administration. Tout ce qu’il vous faut pour bâtir une application prête pour la production avec l’esthétique affirmée de RetroUI.

Qu’est-ce qui est inclus ?

Une mise en page de dashboard complète

• Navigation latérale avec menu repliable
• En-tête supérieur avec recherche et profil utilisateur
• Un design responsive qui tient la route sur mobile, tablette et desktop

Des pages prêtes à l’emploi

• Vue d’ensemble du dashboard avec métriques et graphiques
• Gestion des utilisateurs (liste, détail, édition)
• Page de réglages avec exemples de formulaires
• Page de documentation d’API
• Gestion de la facturation et des abonnements

Un mode sombre soigné

• Pas de simples couleurs inversées : une conception pensée pour les fonds sombres
• Un contraste élevé pour la lisibilité
• Des couleurs d’accent vives qui claquent sur fond sombre

Des fonctionnalités prêtes pour la production

• Écrans d’authentification (connexion, inscription, mot de passe oublié)
• États d’erreur et états vides
• Skeletons de chargement
• Notifications toast
• Boîtes de dialogue modales et confirmations

Pensé pour les développeurs

• Développé en TypeScript
• Structure de composants documentée
• Facile à personnaliser et à étendre
• Conforme aux conventions de l’App Router de Next.js

Ce n’est pas un template gadget. C’est une fondation sur laquelle bâtir de vrais produits. Que vous lanciez un nouveau SaaS, un outil interne ou une plateforme pour développeurs, ce template vous donne une longueur d’avance.

Et oui, il ne ressemble à aucun autre template de dashboard. C’est précisément le but.

Pourquoi ça compte

RetroUI 2.0 ne se résume pas à empiler des fonctionnalités. L’enjeu, c’est de rendre RetroUI plus puissant, plus souple et plus utile pour des projets bien réels.

La prise en charge de Base UI rime avec de meilleures performances et une meilleure accessibilité.

Le site unifié rime avec une découverte facilitée et une meilleure expérience pour tout le monde.

Des docs améliorées riment avec moins de temps à chercher et plus de temps à construire.

Plus de 100 nouveaux blocks riment avec des pages complètes livrées en quelques minutes, pas en plusieurs jours.

Le template en mode sombre rime avec une base solide pour votre prochain projet.

Mises bout à bout, ces nouveautés font de RetroUI 2.0 la bibliothèque d’interface la plus complète et la plus prête pour la production, pour les développeurs qui refusent de bâtir des interfaces sans saveur.

Et maintenant ?

C’est une grosse version, mais on ne s’arrête pas là. Voici ce qui figure sur la feuille de route :

• De nouveaux templates (variantes en mode clair, landing pages, e-commerce)
• Une intégration Figma vers code pour accélérer le passage du design au développement
• De nouveaux composants Base UI au fil de l’élargissement de la bibliothèque
• Une vitrine communautaire mettant en avant des projets bâtis avec RetroUI
• Des tutoriels vidéo qui décortiquent les patterns et cas d’usage courants

Et on tend l’oreille. Un composant qu’il vous manque, une fonctionnalité que vous attendez, un problème qui vous bloque ? Dites-le-nous. RetroUI est fait pour les développeurs, par des développeurs. Vos retours dessinent ce qu’on construit ensuite.

Passez à RetroUI 2.0 dès aujourd’hui

Prêt à vous lancer ? Voici par où commencer :

Vous débutez avec RetroUI

Copier# Install RetroUI
npx retroui-cli init
 
# Or install via npm
npm install @retroui/react

Parcourez les composants, explorez les blocks et récupérez le nouveau template. Tout est prêt à l’emploi dans votre projet Next.js, React ou Vite.

Vous utilisez déjà RetroUI

Si RetroUI fait déjà partie de vos outils, passer à la 2.0 se fait sans accroc :

pnpmnpmyarnbun
pnpm add @retroui/react@latest
npm install @retroui/react@latest
yarn add @retroui/react@latest
bun add @retroui/react@latest
Copier

Consultez le changelog pour repérer d’éventuels changements cassants (il y en a très peu, et on a documenté un contournement pour chacun).

Merci

Si RetroUI existe, c’est parce que des développeurs comme vous en ont assez des designs génériques. Vous voulez bâtir des choses qui sortent du lot, qui ont une personnalité, qui donnent une autre impression.

Nous sommes là pour vous faciliter la tâche.

La version 2.0 est le fruit de plusieurs mois de travail, de centaines de commits, d’innombrables itérations de design et des retours d’une communauté formidable. Merci de faire partie de l’aventure.

Maintenant, allez construire quelque chose d’audacieux. 🚀

Explorez RetroUI 2.0 :

• Parcourir les composants
• Découvrir les blocks
• Récupérer le template
• Lire la documentation
• Rejoindre la communauté

Des questions ? Des retours ? Un bug déniché ? Ouvrez une issue sur GitHub ou écrivez-nous sur Twitter/X.