IP ごとに世界観が違う UI を、デザイントークンで吸収している話
本記事は、Applibot Advent Calendar 2025 の14日目の記事になります。 はじめに：マルチプロダクトを最速で届けるために アプリボットでは、エンターテインメント系の複数プロダクトを IP 単位で展開しています。 提供している機能自体は共通している一方で、それぞれの IP には固有の世界観があり、UI でもその差異を表現する必要があります。 このような前提のもと、 IP ごとに異なる世界観を、いかに低コストかつスピーディに再現できるか という観点から、UI コンポーネントの共通化とデザイントークンの設計に注目しました。 本記事では、UI コンポーネントは共通のままに、 デザイントークンがプロダクトごとの差分を吸収するというアプローチを選択し、 その具体的な設計方法について紹介します。 対象読者 本記事は、以下のような方を主な対象読者としています。 複数プロダクト／複
Svelte × Tailwind CSSの「Rabee UI」コンポーネント5種類を新たに公開しました
株式会社Rabee（本社：東京都渋谷区、代表取締役：上松勇喜）は、Svelte × Tailwind CSSのUIコンポーネント集「Rabee UI」において、UIコンポーネント5種類を新たに公開しました。 今回リリースしたコンポーネントも含む全29種類のRabee UIは、以下から確認できます。 ■ Rabee UIとは Rabee UIとは、SvelteとTailwind CSSで構築されたUIコンポーネント集であり、カスタマイズを前提とした「コンポーネントの種」です。プロダクトごとに色やフォント、アニメーションなどを自由にカスタマイズすることで、プロダクトらしさを表現するデザインシステムをスピーディーに作り上げます。
Svelte × Tailwind CSSの「Rabee UI」コンポーネント8種類を新たに公開しました
株式会社Rabee（本社：東京都渋谷区、代表取締役：上松勇喜）は、Svelte × Tailwind CSSベースのUIコンポーネント集「Rabee UI」において、UIコンポーネント8種類を新たに公開しました。 今回リリースしたコンポーネントも含む全24種類のコンポーネントは、以下から確認できます。 ■ Rabee UIとは Rabee UIとは、SvelteとTailwind CSSで構築されたUIコンポーネント集であり、カスタマイズを前提とした「コンポーネントの種」です。プロダクトごとに色やフォント、アニメーションなどを自由にカスタマイズすることで、プロダクトらしさを表現するデザインシステムをスピーディーに作り上げます。
Welcome to the W3C design system - W3C Design System
This design system documents the styles, components and templates available to use on your website. Find out how to get started. How the front end assets (CSS and JavaScript) are organised and compiled is discussed below. ¶CSS The design system uses Sass - specifically the SCSS syntax) - which is compiled into CSS files. The CSS approach is heavily influenced by Andy Bell's CUBE CSS. This has some
nino+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Ratione dolorem eveniet doloribus quaerat sed, expedita ipsa provident fugiat libero facere, impedit magnam nobis temporibus enim dicta dolore obcaecati illum ab! Lorem ipsum dolor sit amet consectetur adipisicing elit. Ratione dolorem eveniet doloribus quaerat sed, expedita ipsa provident fugiat libero facere, impedit magnam nobis temporibu
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
React Bits
GitHub - keenthemes/reui: Open-source collection of UI components and animated effects built with React, Typescript, Tailwind CSS, and Motion. Pairs beautifully with shadcn/ui.
GitHub - DavidHDev/react-bits: An open source collection of animated, interactive & fully customizable React components for building stunning, memorable websites.
Origin UI - Beautiful UI components built with Tailwind CSS and React
https://x.com/takamosoo/status/1884527500245741724
https://x.com/kon_corder/status/1846475921970352324?s=12&t=WLoQjPOJLfZ0ZJFtTOS7aw
FlyonUI - Free Tailwind CSS UI Components Library
https://x.com/kukaarmedin/status/1841573660554842315?s=12&t=WLoQjPOJLfZ0ZJFtTOS7aw
Components - W3C Design System
https://x.com/shiba_program/status/1788131738000216108?s=12&t=WLoQjPOJLfZ0ZJFtTOS7aw
https://twitter.com/shiba_program/status/1782333524155978150?s=46&t=WLoQjPOJLfZ0ZJFtTOS7aw
The Component Gallery
GitHub - shoelace-style/shoelace: Web Awesome ("Shoelace 3") has been released! Get it here 👇👇👇
GitHub - toshusai/cmpui: CmpUI is a component library designed for creating complex GUI applications in web browsers.
https://twitter.com/d151005/status/1766128024339308920