# UI/UX · Veille technologique

[Source canonique](<https://sebastien.rigaux.be/veille/tags/ui-ux/page/3>)

Conception d’interfaces et de parcours adaptés aux besoins des utilisateurs.

## [Sera UI : des composants React et Next.js personnalisables](<https://sebastien.rigaux.be/veille/liens/sera-ui-des-composants-react-et-next-js-personnalisables>)

Sera UI rassemble des composants JSX et blocs d’interface stylés avec Tailwind CSS. La collection fournit une base modulable pour formulaires, dashboards et pages web.

2025-10-07 · [Markdown](<https://sebastien.rigaux.be/veille/liens/sera-ui-des-composants-react-et-next-js-personnalisables.md>) · [Ressource originale](<https://seraui.com/>)

## [EmbedPDF : ajouter un lecteur PDF indépendant du framework](<https://sebastien.rigaux.be/veille/liens/embedpdf-ajouter-un-lecteur-pdf-independant-du-framework>)

EmbedPDF fournit un lecteur PDF JavaScript intégrable à plusieurs frameworks. Le dépôt distingue la branche stable de la version en développement et renvoie vers démonstrations et documentation.

2025-09-07 · [Markdown](<https://sebastien.rigaux.be/veille/liens/embedpdf-ajouter-un-lecteur-pdf-independant-du-framework.md>) · [Ressource originale](<https://github.com/embedpdf/embed-pdf-viewer>)

## [Lina : adapter les zones de scroll au tactile et au bureau](<https://sebastien.rigaux.be/veille/liens/lina-adapter-les-zones-de-scroll-au-tactile-et-au-bureau>)

Lina propose une zone de défilement avec barres adaptatives et masques de bord sensibles à la position. Le composant cherche à conserver le comportement natif sur tactile tout en affinant les interactions au bureau.

2025-09-07 · [Markdown](<https://sebastien.rigaux.be/veille/liens/lina-adapter-les-zones-de-scroll-au-tactile-et-au-bureau.md>) · [Ressource originale](<https://lina.sameer.sh/>)

## [DivKit : décrire une interface multiplateforme depuis le serveur](<https://sebastien.rigaux.be/veille/liens/divkit-decrire-une-interface-multiplateforme-depuis-le-serveur>)

DivKit décrit éléments, états et animations dans des données envoyées au client. Les rendus natifs Android, iOS et web permettent de faire évoluer des interfaces sans une nouvelle release pour chaque changement.

2025-08-08 · [Markdown](<https://sebastien.rigaux.be/veille/liens/divkit-decrire-une-interface-multiplateforme-depuis-le-serveur.md>) · [Ressource originale](<https://divkit.tech/en/>)

## [Puck : construire des pages avec les composants de son application](<https://sebastien.rigaux.be/veille/liens/puck-construire-des-pages-avec-les-composants-de-son-application>)

Puck présente un éditeur visuel intégrable à React avec composants, règles de design et API métier. La plateforme propose également de générer des interfaces à partir de ces mêmes éléments.

2025-07-29 · [Markdown](<https://sebastien.rigaux.be/veille/liens/puck-construire-des-pages-avec-les-composants-de-son-application.md>) · [Ressource originale](<https://puckeditor.com/>)

## [Flora : organiser la création visuelle IA sur un canvas](<https://sebastien.rigaux.be/veille/liens/flora-organiser-la-creation-visuelle-ia-sur-un-canvas>)

Flora réunit modèles de texte, d’image et de vidéo dans un espace de création partagé. Le canvas permet d’explorer des variantes et de transformer une idée en workflow reproductible.

2025-07-14 · [Markdown](<https://sebastien.rigaux.be/veille/liens/flora-organiser-la-creation-visuelle-ia-sur-un-canvas.md>) · [Ressource originale](<https://flora.ai/>)

## [Kibo UI : étendre shadcn/ui avec des composants composables](<https://sebastien.rigaux.be/veille/liens/kibo-ui-etendre-shadcn-ui-avec-des-composants-composables>)

Kibo UI propose un registre de composants conçus pour shadcn/ui. Sélecteur de couleur, zoom d’image ou blocs de code enrichissent la boîte à outils tout en restant personnalisables.

2025-07-12 · [Markdown](<https://sebastien.rigaux.be/veille/liens/kibo-ui-etendre-shadcn-ui-avec-des-composants-composables.md>) · [Ressource originale](<https://www.kibo-ui.com/>)

## [Puck : embarquer un éditeur visuel dans une application React](<https://sebastien.rigaux.be/veille/liens/puck-embarquer-un-editeur-visuel-dans-une-application-react>)

Puck est un composant React pour créer un éditeur par glisser-déposer avec ses propres composants. Son modèle modulaire laisse l’application gérer les données et les règles de composition.

2025-06-01 · [Markdown](<https://sebastien.rigaux.be/veille/liens/puck-embarquer-un-editeur-visuel-dans-une-application-react.md>) · [Ressource originale](<https://github.com/puckeditor/puck>)

## [21st : explorer composants, templates et thèmes React](<https://sebastien.rigaux.be/veille/liens/21st-explorer-composants-templates-et-themes-react>)

21st rassemble des composants et blocs d’interface, notamment des hero sections, cartes et arrière-plans animés. Le catalogue sert à comparer des directions visuelles et récupérer une base à adapter.

2025-05-08 · [Markdown](<https://sebastien.rigaux.be/veille/liens/21st-explorer-composants-templates-et-themes-react.md>) · [Ressource originale](<https://21st.dev/>)

## [Coss UI : une bibliothèque de composants construite sur Base UI](<https://sebastien.rigaux.be/veille/liens/coss-ui-une-bibliotheque-de-composants-construite-sur-base-ui>)

L’ancienne adresse Origin UI mène désormais à coss ui et à son catalogue de composants. Accordéons, dialogues, champs et calendriers donnent une base commune pour assembler des interfaces.

2025-05-08 · [Markdown](<https://sebastien.rigaux.be/veille/liens/coss-ui-une-bibliotheque-de-composants-construite-sur-base-ui.md>) · [Ressource originale](<https://coss.com/ui>)

## [PDFSlick : intégrer navigation et outils PDF dans une application web](<https://sebastien.rigaux.be/veille/liens/pdfslick-integrer-navigation-et-outils-pdf-dans-une-application-web>)

PDFSlick fournit des exemples de lecteurs PDF pour React, Svelte, SolidJS et JavaScript. Navigation, miniatures et zoom illustrent comment traiter les documents comme une partie de l’interface.

2025-05-04 · [Markdown](<https://sebastien.rigaux.be/veille/liens/pdfslick-integrer-navigation-et-outils-pdf-dans-une-application-web.md>) · [Ressource originale](<https://pdfslick.dev/>)

## [Made with React : découvrir des projets et composants de l’écosystème](<https://sebastien.rigaux.be/veille/liens/made-with-react-decouvrir-des-projets-et-composants-de-l-ecosysteme>)

Ce catalogue présente des applications, composants, frameworks et outils construits autour de React. Les catégories facilitent la recherche d’exemples et de bibliothèques à examiner.

2025-02-25 · [Markdown](<https://sebastien.rigaux.be/veille/liens/made-with-react-decouvrir-des-projets-et-composants-de-l-ecosysteme.md>) · [Ressource originale](<https://madewithreactjs.com/>)

## [Motion Primitives : composer des interfaces avec des animations ajustables](<https://sebastien.rigaux.be/veille/liens/motion-primitives-composer-des-interfaces-avec-des-animations-ajustables>)

Cette collection fournit des composants d’interface animés à copier et personnaliser. Les démonstrations couvrent notamment le texte et les transitions pour enrichir des interactions existantes.

2025-02-20 · [Markdown](<https://sebastien.rigaux.be/veille/liens/motion-primitives-composer-des-interfaces-avec-des-animations-ajustables.md>) · [Ressource originale](<https://motion-primitives.com/>)

## [React Bits : adapter des composants animés depuis leur code source](<https://sebastien.rigaux.be/veille/liens/react-bits-adapter-des-composants-animes-depuis-leur-code-source>)

React Bits rassemble des arrière-plans, effets de texte et composants interactifs installables sous forme de code. Les paramètres exposés permettent d’ajuster mouvement et apparence au projet.

2025-02-15 · [Markdown](<https://sebastien.rigaux.be/veille/liens/react-bits-adapter-des-composants-animes-depuis-leur-code-source.md>) · [Ressource originale](<https://reactbits.dev/>)

## [Onlook : modifier visuellement une interface Next.js et Tailwind](<https://sebastien.rigaux.be/veille/liens/onlook-modifier-visuellement-une-interface-next-js-et-tailwind>)

Onlook propose un éditeur visuel qui travaille sur le code de l’application. Le dépôt présente l’édition de pages et de styles directement depuis le navigateur, avec assistance IA.

2025-01-29 · [Markdown](<https://sebastien.rigaux.be/veille/liens/onlook-modifier-visuellement-une-interface-next-js-et-tailwind.md>) · [Ressource originale](<https://github.com/onlook-dev/onlook>)

## [Pragmatic Drag and Drop : des exemples de listes réordonnables](<https://sebastien.rigaux.be/veille/liens/pragmatic-drag-and-drop-des-exemples-de-listes-reordonnables>)

Atlassian illustre les briques de sa bibliothèque avec des exemples de glisser-déposer. Les démonstrations et leur code permettent d’adapter les interactions à différents environnements frontend.

2024-12-20 · [Markdown](<https://sebastien.rigaux.be/veille/liens/pragmatic-drag-and-drop-des-exemples-de-listes-reordonnables.md>) · [Ressource originale](<https://atlassian.design/components/pragmatic-drag-and-drop/examples>)

## [QuickPic : convertir et préparer de petites images pour le web](<https://sebastien.rigaux.be/veille/liens/quickpic-convertir-et-preparer-de-petites-images-pour-le-web>)

QuickPic réunit des utilitaires pour convertir un SVG en PNG, produire une image carrée ou arrondir ses coins. Des opérations ciblées pour préparer rapidement des visuels.

2024-11-10 · [Markdown](<https://sebastien.rigaux.be/veille/liens/quickpic-convertir-et-preparer-de-petites-images-pour-le-web.md>) · [Ressource originale](<https://quickpic.t3.gg/>)

## [Uiverse : explorer des éléments d’interface réutilisables](<https://sebastien.rigaux.be/veille/liens/uiverse-explorer-des-elements-d-interface-reutilisables>)

Uiverse rassemble des éléments d’interface créés par la communauté, avec du code HTML/CSS, Tailwind ou React. Une ressource pour étudier des styles et adapter des composants à son projet.

2024-10-13 · [Markdown](<https://sebastien.rigaux.be/veille/liens/uiverse-explorer-des-elements-d-interface-reutilisables.md>) · [Ressource originale](<https://uiverse.io/>)

## [ThumbHash : encoder un aperçu d’image compact avec transparence](<https://sebastien.rigaux.be/veille/liens/thumbhash-encoder-un-apercu-d-image-compact-avec-transparence>)

ThumbHash représente un aperçu d’image dans quelques données faciles à stocker avec le contenu. Il encode notamment le ratio et la transparence pour améliorer l’affichage avant le chargement de l’image complète.

2024-09-14 · [Markdown](<https://sebastien.rigaux.be/veille/liens/thumbhash-encoder-un-apercu-d-image-compact-avec-transparence.md>) · [Ressource originale](<https://github.com/evanw/thumbhash>)

## [BlurHash : afficher un aperçu pendant le chargement des images](<https://sebastien.rigaux.be/veille/liens/blurhash-afficher-un-apercu-pendant-le-chargement-des-images>)

BlurHash transforme une image en une courte chaîne représentant un aperçu flouté. Le client peut l’afficher immédiatement pour éviter les cases vides pendant le téléchargement.

2024-09-14 · [Markdown](<https://sebastien.rigaux.be/veille/liens/blurhash-afficher-un-apercu-pendant-le-chargement-des-images.md>) · [Ressource originale](<https://github.com/woltapp/blurhash>)

Page 3 / 4

[Précédent](<https://sebastien.rigaux.be/veille/tags/ui-ux/page/2>)

[Suivant](<https://sebastien.rigaux.be/veille/tags/ui-ux/page/4>)
