# tailwind Published articles for tailwind. This is one page of public article previews, not the complete archive. Follow Next page to continue. Summaries are not the original full articles. ## The aircraft might not be flying, but the certificate has gone on vacation DevFeed: [The aircraft might not be flying, but the certificate has gone on vacation]() Original publisher: [Read original article]() Author: Richard Speed Published: 2026-09-12T09:00:00Z Content type: news Language: en Sources: [www.theregister.com - Articles]() Topics: [Cybersecurity](), [Artificial Intelligence](), [NVLink](), [Vibe coding](), [ARKTunnel](), [Cybercrime](), [.NET](), [how to create smooth CSS transitions]() Tags: [ai](), [bork](), [cybersecurity](), [malware](), [nvidia](), [offbeat](), [phishing](), [security](), [tailwind](), [ubuntu]() ### AI overview A news roundup covering security incidents, AI-related developments, semiconductor infrastructure, phishing, ransomware, open-source software, and web development. The supplied title concerns an aircraft certificate, while the body mainly contains unrelated headlines. ### Source excerpt Information is not forthcoming from this screen ## How to Build an AI Chat App Interface With the Vercel AI SDK and Shadcn/ui DevFeed: [How to Build an AI Chat App Interface With the Vercel AI SDK and Shadcn/ui]() Original publisher: [Read original article]() Author: Vaibhav Gupta Published: 2026-09-11T16:21:29Z Content type: tutorial Language: en Sources: [freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More]() Topics: [vercel ai sdk](), [AI Chat](), [SDKs](), [Node.js]() Tags: [ai](), [app](), [how-to](), [llm](), [mcp](), [next-js](), [node](), [openai](), [react](), [shadcn-ai-chat-app](), [shadcn-ui](), [streaming](), [tailwind](), [typescript](), [ui](), [vercel](), [vercel-ai-sdk]() ### AI overview Tutorial for building a streaming AI chat interface in Next.js with the Vercel AI SDK and shadcn/ui. ### Source excerpt Every other AI product you open today has the same screen: a message list, a text box at the bottom, and words that stream in one token at a time. It looks simple, but it's not simple to build well. Y ## Shopify extends lifeline to Tailwind as vibe coding erodes web dev platform's bottom line DevFeed: [Shopify extends lifeline to Tailwind as vibe coding erodes web dev platform's bottom line]() Original publisher: [Read original article]() Author: Brandon Vigliarolo Published: 2026-09-10T19:43:55Z Content type: news Language: en Sources: [www.theregister.com - Articles]() Topics: [Web Development](), [modern web development]() Tags: [acquisition](), [acquisitions](), [ai-and-ml](), [css](), [devops](), [foss](), [framework](), [open-source](), [shopify](), [tailwind](), [vibe-coding](), [web](), [web-developers]() ### AI overview Shopify's acquisition gives the open-source CSS framework Tailwind a stable long-term home amid pressure on web development platforms from vibe coding. ### Source excerpt Acquisition gives open source CSS framework 'a stable long-term home' ## Tailwind Labs is joining Shopify DevFeed: [Tailwind Labs is joining Shopify]() Original publisher: [Read original article]() Published: 2026-09-09T13:15:00Z Content type: news Language: en Sources: [Tailwind CSS Blog]() Topics: [Web Development](), [modern web development]() Tags: [css](), [framework](), [open-source](), [shopify](), [tailwind](), [user-interfaces]() ### AI overview Tailwind Labs is joining Shopify, which will provide a long-term home for maintaining Tailwind CSS. The team says Tailwind and its other open-source projects will remain MIT-licensed and community-led. ### Source excerpt We're joining Shopify to give Tailwind a stable long-term home where it will be actively maintained for the millions of people who depend on it. ## Tailwind's rem-Based Breakpoints and Their Accessibility Tradeoffs DevFeed: [Tailwind's rem-Based Breakpoints and Their Accessibility Tradeoffs]() Original publisher: [Read original article]() Author: Freek Van der Herten (freek@spatie.be) Published: 2026-08-14T10:30:33Z Content type: article Language: en Sources: [freek.dev - all blogposts]() Topics: [Tailwind CSS](), [Accessibility](), [browser]() Tags: [accessibility](), [accessible](), [best-practices](), [browser](), [css](), [responsive](), [tailwind]() ### AI overview This article examines Tailwind's default rem-based breakpoints and their accessibility tradeoffs. Browser font-size preferences can shift layouts, which may help some users, while px breakpoints remain a defensible choice. ### Source excerpt A sharp look at Tailwind's default rem-based breakpoints, and the accessibility tradeoff they make. It explains how browser font-size preferences can shift layouts, why that can help some users, and why px breakpoints are still a defensible choice. Read more ## AI-assisted design-system rewrites are fast to generate but slow to refine DevFeed: [AI-assisted design-system rewrites are fast to generate but slow to refine]() Original publisher: [Read original article]() Author: hi@swizec.com (Swizec Teller) Published: 2026-08-08T00:00:00Z Content type: opinion Language: en Sources: [Swizec Teller]() Topics: [Artificial Intelligence](), [Large Language Model](), [Claude](), [Design system](), [stacked pull requests](), [Bootstrap](), [Tailwind CSS]() Tags: [ai](), [claude](), [design-system](), [github](), [llms](), [stacked-pull-requests](), [tailwind]() ### AI overview The author describes using AI and Claude to migrate a design system from Bootstrap to Tailwind, clean up HTML and JavaScript, and rewrite functional code. The article argues that LLMs handle mechanical translation well but struggle with conceptual design decisions and fine UI details, making cleanup substantially more time-consuming than code generation. ### Source excerpt Spaceship first, cleanup second. Start with the ending then work your way back to something useful. ## 5 best practices for preventing chaos in Tailwind CSS DevFeed: [5 best practices for preventing chaos in Tailwind CSS]() Original publisher: [Read original article]() Author: Travis Turner (richardturner@evilmartians.com) Published: 2026-08-05T00:00:00Z Content type: tutorial Language: en Sources: [Evil Martians]() Topics: [Tailwind CSS](), [CSS Framework](), [Design system](), [Web Development]() Tags: [best-practices](), [code](), [css](), [design-system](), [development](), [javascript](), [tailwind](), [tailwind-css]() ### AI overview This tutorial presents best practices for using Tailwind CSS as applications grow, emphasizing the importance of a consistent design system and reusable design tokens to keep class lists and interfaces maintainable. ### Source excerpt Tailwind CSS has become a very popular CSS framework, and it can speed up development. But using it without proper caution can add mayhem to your code. Learn best practices to avoid getting swept away! ## Agents change the math on big bang migrations DevFeed: [Agents change the math on big bang migrations]() Original publisher: [Read original article]() Author: hi@swizec.com (Swizec Teller) Published: 2026-08-01T00:00:00Z Content type: opinion Language: en Sources: [Swizec Teller]() Topics: [migration](), [Tailwind CSS](), [Bootstrap](), [Design system](), [Tech Debt](), [ui](), [React]() Tags: [agents](), [bootstrap](), [design-system](), [migrations](), [react](), [tailwind](), [tech-debt]() ### AI overview An opinion article argues that AI agents may change how teams approach large software migrations. It describes a one-step migration of hundreds of pages from Bootstrap to Tailwind in a 22,000-line pull request, which the author says fixed 13 small bugs without materially disrupting the company. ### Source excerpt I just did a team's worth of work in 5 days. Honestly I am shook to the core of my 20 YoE ## Tailwind CSS vs. StyleX: A real migration with 20 components DevFeed: [Tailwind CSS vs. StyleX: A real migration with 20 components]() Original publisher: [Read original article]() Author: Chizaram Ken Published: 2026-07-27T13:00:36Z Content type: comparison Language: en Sources: [LogRocket Blog]() Topics: [Tailwind CSS](), [migration](), [CSS](), [Web Development](), [React]() Tags: [code](), [comparison](), [css](), [dev](), [developer-experience](), [migration](), [tailwind](), [time](), [uncategorized]() ### AI overview A practical comparison of migrating 20 production-style components from Tailwind CSS to StyleX. The article measures lines of code, CSS output, build time, configuration effort, and styling issues, finding that StyleX used more styling code, produced a similar CSS bundle, built slightly faster in the test, and provided stronger static checks. ### Source excerpt I migrated 20 production-style components from Tailwind to StyleX. Here's what the data showed about LOC, CSS bundle size, build time, and type safety. The post Tailwind CSS vs. StyleX: A real migration with 20 components appeared first on LogRocket Blog. ## The "Pixel Police" are Retired: Why AI Agents are the New Mediators of Web Design DevFeed: [The "Pixel Police" are Retired: Why AI Agents are the New Mediators of Web Design]() Original publisher: [Read original article]() Author: Noah Davis Published: 2026-07-20T12:17:00Z Content type: opinion Language: en Sources: [Web Designer Depot]() Topics: [AI Agent](), [Artificial Intelligence](), [web design](), [Web Development](), [Figma](), [Tailwind CSS](), [vs-code](), [Code]() Tags: [ai](), [ai-agent](), [ai-agents](), [ai-agents-in-design](), [ai-driven-ux](), [ai-in-frontend-development](), [ai-tech](), [ai-web-design](), [collaborative-design-tools](), [contextual-scaffolding](), [creative-automation](), [css](), [design](), [design-dna-systems](), [design-to-code-tools](), [designer-developer-handoff](), [developer-as-architect](), [figma](), [figma-to-code-automation](), [future-of-web-design](), [low-code-design-systems](), [no-code-evolution](), [parallel-workspaces](), [product-design-workflows](), [tailwind](), [tailwind-automation](), [ui-automation](), [vs-code](), [web](), [web-design-workflow-2026](), [workflow]() ### AI overview The article argues that AI agents are transforming web design by replacing the traditional designer-developer handoff with shared, real-time workflows. Designers provide contextual rules from Figma, while agents generate much of the implementation using established Tailwind tokens, allowing teams to focus more on creative and problem-solving work. ### Source excerpt The designer-developer handoff is officially dead--and AI just pulled the trigger. Instead of wasting weeks translating pixels into code, teams are now building live, together, in real time with AI agents doing the grunt work. ## My Frontend Stack In 2026 DevFeed: [My Frontend Stack In 2026]() Original publisher: [Read original article]() Author: The T-Shaped Dev Published: 2026-05-23T02:19:53Z Content type: opinion Language: en Sources: [The T-Shaped Dev]() Topics: [Front end](), [Next.js](), [Vite](), [React](), [Tailwind CSS](), [Shadcn UI](), [TypeScript](), [Single-page application (SPA)](), [Server-side rendering]() Tags: [2026](), [frontend](), [next-js](), [react](), [ssr](), [tailwind](), [tailwind-css](), [typescript](), [vite]() ### AI overview An opinionated overview of a 2026 frontend stack for production applications. The author describes choosing Next.js for content-heavy sites, Vite with React and TypeScript for internal tools and single-page applications, pnpm for package management, and Tailwind CSS with shadcn/ui for styling and components. ### Source excerpt The tools I actually reach for when building production apps, from framework to the moment a user hits a bug. ## Generate editorial React presentations with one Claude Code prompt DevFeed: [Generate editorial React presentations with one Claude Code prompt]() Original publisher: [Read original article]() Author: Ishan Khanna Published: 2026-05-17T08:17:35Z Content type: tutorial Language: en Sources: [Ishan Khanna]() Topics: [Claude Code](), [React](), [Code](), [Large Language Model](), [Tailwind CSS](), [Vite]() Tags: [animation](), [architecture](), [claude-code](), [code](), [how-to](), [keyboard](), [llm](), [llms](), [presentation](), [prompt](), [prompting](), [react](), [tailwind](), [vite]() ### AI overview A tutorial presents a detailed Claude Code prompt for generating five-slide React presentations as a single Presentation.jsx file. The prompt fixes the design system and narrative structure while allowing the topic content to change, and the result can be used in a Vite, React, and Tailwind project. ### Source excerpt If you caught my YouTube Short on generating presentations as React apps with an LLM, this is the prompt I promised. Paste it into Claude Code, edit the CONTENT block at the top, and you get back a single-file Presentation.jsx -- five slides, keyboard nav, animated counters, an ## Moving away from Tailwind, and learning to structure my CSS DevFeed: [Moving away from Tailwind, and learning to structure my CSS]() Original publisher: [Read original article]() Author: Julia Evans Published: 2026-05-15T00:00:00Z Content type: article Language: en Sources: [Julia Evans]() Topics: [CSS](), [Tailwind CSS](), [Front end](), [CSS Resets](), [Code](), [Responsive Design]() Tags: [code](), [css](), [frontend](), [how-to](), [responsive-design](), [tailwind]() ### AI overview The author describes migrating several sites from Tailwind to semantic HTML and vanilla CSS, using lessons from Tailwind to create clearer systems for structuring CSS. The article discusses resets, components, colors, font sizes, utility classes, spacing, responsive design, and the build system. ### Source excerpt Hello! 8 years ago, I wrote excitedly about discovering Tailwind. At that time I really had no idea how to structure my CSS code and given the choice between a pile of complete chaos and Tailwind, I was really happy to choose Tailwind. It helped me make a lot of tiny sites! I spent the last week or so migrating a couple of sites away from Tailwind and towards more semantic HTML + vanilla CSS, and it was SO fun and SO interesting, so here are some things I learned! As usual I'm not a full-time frontend developer and so all of my CSS learning has happened in fits and starts over many years. it turns out Tailwind taught me a lot When I started thinking about structuring CSS, I was intimidated at first: I'm not very good at structuring my CSS! But then I started reading blog posts talking about how to structure CSS (like A whole cascade of layers or How I write CSS in 2024) and I realized a couple of things: Every CSS code base has a bunch of different things going on (layouts! fonts! colours! common components!) It's extremely useful to have systems or guidelines to manage each of those things, otherwise things descend into chaos Tailwind has systems for some of these, and I already know those systems! Maybe I can imitate the systems I like! For example, Tailwind has: a reset stylesheet a colour palette a font scale the systems I'm going to talk about I'm going to talk about a few aspects of my CSS codebase and my thoughts so far what kind of rules I want to impose on the codebase for each one. Some of them are copied from Tailwind and some aren't. reset components colours font sizes utility classes the base spacing responsive design the build system 1. reset I just copied Tailwind's "preflight styles" by going into tailwind.css and copying the first 200 lines or so. I noticed that I've developed a relationship with Tailwind's CSS reset over time, for example Tailwind sets box-sizing: border-box on every element (which means that an element's width includes its padding ## Issued - Small, Fast, Self-Hosted Comic Library Server DevFeed: [Issued - Small, Fast, Self-Hosted Comic Library Server]() Original publisher: [Read original article]() Author: Metalogico Published: 2026-05-10T16:52:11Z Content type: article Language: en Sources: [Noted]() Topics: [servers](), [FastAPI](), [Python](), [htmx](), [Tailwind CSS](), [App](), [browser](), [.NET]() Tags: [app](), [browser](), [htmx](), [performance](), [python](), [self-hosted](), [self-hosted-media-streaming-audio-streaming](), [server](), [tailwind](), [technology-stack]() ### AI overview Issued is a small, self-hosted comic library server built with Python, FastAPI, Tailwind and HTMX. It scans CBZ and CBR files while preserving existing folder structures, provides browser and OPDS-compatible reading, and emphasizes lightweight performance for large collections. ### Source excerpt Issued is a personal comic library server built for a simple, focused reading experience. ## Tailwind CSS v4.3: Scrollbars, new colors, and more DevFeed: [Tailwind CSS v4.3: Scrollbars, new colors, and more]() Original publisher: [Read original article]() Published: 2026-05-08T20:00:00Z Content type: release Language: en Sources: [Tailwind CSS Blog]() Topics: [Tailwind CSS](), [modern web development](), [Webpack](), [Next.js](), [Netflix](), [Vercel]() Tags: [css](), [netflix](), [next-js](), [releases](), [tailwind](), [vercel]() ### AI overview Tailwind CSS v4.3 introduces first-party scrollbar styling, size-container utilities, direct utilities for additional CSS properties, tab-size controls, stacked and compound variants in CSS, and default values for functional utilities. The article also covers v4.2 additions, including new color palettes, a webpack plugin, logical property utilities, and OpenType feature controls. ### Source excerpt Tailwind CSS v4.3 is here with first-party scrollbar styling, even more logical property utilities, new zoom and tab-size utilities, better @variant support, and all the v4.2 stuff we shipped while forgetting blogs existed. ## Sharing Tailwind CSS Styles Across Apps in a PNPM Workspaces Nx Monorepo DevFeed: [Sharing Tailwind CSS Styles Across Apps in a PNPM Workspaces Nx Monorepo]() Original publisher: [Read original article]() Author: Juri Strumpflohner Published: 2026-04-10T00:00:00Z Content type: tutorial Language: en Sources: [Juri Strumpflohner]() Topics: [Tailwind CSS](), [monorepo](), [Web Development](), [CSS]() Tags: [design](), [how-to](), [monorepo](), [npm-workspaces](), [nx](), [pnpm](), [sync-generators](), [tailwind](), [tailwind-css](), [tokens]() ### AI overview A tutorial on sharing Tailwind v4 design tokens across multiple applications in a pnpm or npm workspaces monorepo. It explains how to place shared CSS in a package, consume it from applications, and use Nx sync generators to automate Tailwind source directives based on project dependencies. ### Source excerpt Share Tailwind v4 design tokens across multiple apps in a pnpm + Nx monorepo using a shared styles package and automated @source directives. ## 100+ FREE React website templates DevFeed: [100+ FREE React website templates]() Original publisher: [Read original article]() Author: iHateReading Published: 2026-03-09T13:40:16Z Content type: article Language: en Sources: [iHateReading]() Topics: [React](), [Website]() Tags: [100-plus-free-react-website-templates](), [backend](), [blockchain](), [coding](), [collection](), [development](), [free](), [frontend](), [gettemplate](), [gettemplate-reactjs-tailwind](), [ihatereading](), [javascript](), [node-js](), [product](), [programming](), [react](), [reactjs](), [tailwind](), [templates](), [typescript](), [web-development]() ### AI overview The article presents a collection of more than 100 free React website templates. ### Source excerpt Hello folks, Welcome to the new blog. Last year, while working with our client, gor this idea of building a collection of website templates. I mean, its helpfu... ## An Experiment in Agent Orchestration at Mintlify DevFeed: [An Experiment in Agent Orchestration at Mintlify]() Original publisher: [Read original article]() Author: Kathryn Lawrence Published: 2026-02-03T00:00:00Z Content type: opinion Language: en Sources: [Mintlify Blog]() Topics: [agent orchestration](), [Claude](), [Claude Code](), [Development](), [React](), [Storybook](), [Tailwind CSS](), [monorepo]() Tags: [agent-orchestration](), [ai-agent](), [claude](), [claude-code](), [development](), [engineering](), [monorepo](), [react](), [storybook](), [tailwind]() ### AI overview Mintlify describes an experiment using agent orchestration and AI coding tools while migrating its internal component system. The article concludes that an army of Claude agents was still no match for one human collaborator, Dmytro. ### Source excerpt TL;DR: We tried agent orchestration, but an army of Claudes is still no match for one Dmytro. ## Skills: The Hidden Engine of AI Agents (And Why You Don't Need a 'Magic Bot') DevFeed: [Skills: The Hidden Engine of AI Agents (And Why You Don't Need a 'Magic Bot')]() Original publisher: [Read original article]() Published: 2026-01-29T10:00:00Z Content type: opinion Language: en Sources: [Antonio Leiva]() Topics: [Agent Skills](), [Bot](), [Artificial Intelligence]() Tags: [agent-skills](), [agents](), [ai](), [ai-agents](), [development](), [mcp](), [playwright](), [productivity](), [react](), [skills](), [tailwind]() ### AI overview The article argues that Agent Skills, rather than a supposedly magical bot, are the main source of extensible agent capabilities. It describes skills as documented files that agents can read and execute on demand, and presents a personal collection for development, infrastructure, communication, content, and operations. It also warns that third-party skills may inject malicious prompts. ### Source excerpt Everything Android, Kotlin and other random topics ## AI's impact on Tailwind Labs, revenue, and open-source sustainability DevFeed: [AI's impact on Tailwind Labs, revenue, and open-source sustainability]() Original publisher: [Read original article]() Author: TheAnkurTyagi Published: 2026-01-26T12:41:38Z Content type: opinion Language: en Sources: [ByteSizedBets]() Topics: [Artificial Intelligence](), [Tailwind CSS](), [coding assistant](), [coding]() Tags: [ai](), [ai-coding](), [coding-assistant](), [engineering](), [revenue](), [tailwind]() ### AI overview This opinion article discusses reported financial and staffing difficulties at Tailwind Labs and considers how AI coding assistants may be affecting Tailwind's adoption, monetization, and the sustainability of open-source developer tools. ### Source excerpt You didn't agree to this, but it's happening. ## Configure Tailwind v4 with Angular in an Nx Monorepo DevFeed: [Configure Tailwind v4 with Angular in an Nx Monorepo]() Original publisher: [Read original article]() Author: Juri Strumpflohner Published: 2026-01-14T00:00:00Z Content type: tutorial Language: en Sources: [Juri Strumpflohner]() Topics: [Tailwind CSS](), [Angular](), [monorepo](), [PostCSS](), [Web Development]() Tags: [angular](), [css](), [generators](), [how-to](), [monorepo](), [nx](), [sync](), [sync-generators](), [tailwind](), [tailwind-css]() ### AI overview A tutorial on configuring Tailwind CSS v4 with Angular in an Nx monorepo. It explains how Angular's PostCSS setup can scan the workspace broadly and produce bloated production CSS, then presents @source directives and Nx Sync Generators as ways to limit scanning and manage library dependencies. ### Source excerpt Learn how Tailwind CSS v4 scanning works with Angular in Nx monorepos, why you may have bloated CSS, and how to optimize it with @source directives and Nx Sync Generators. ## Reusable Prompts: The Future of Starter Templates DevFeed: [Reusable Prompts: The Future of Starter Templates]() Original publisher: [Read original article]() Author: Andre Landgraf Published: 2026-01-08T16:26:24Z Content type: article Language: en Sources: [Blog -- Neon Docs]() Topics: [AI-assisted coding](), [Boilerplate](), [cursor](), [Drizzle](), [vercel ai sdk]() Tags: [agent-skills](), [ai](), [ai-agents](), [ai-assisted-coding](), [ai-coding](), [anthropic](), [claude-code](), [cursor](), [drizzle](), [mcp](), [product](), [tailwind](), [vercel](), [vibe-coding]() ### AI overview The article argues that reusable prompts, skills, MCP integrations, and plugins can replace traditional starter-template boilerplate for AI-assisted development. ### Source excerpt Looking back at 2025, AI changed coding for good. Early in the year, skepticism around AI-assisted coding was still high and capabilities were limited. Now it's clear that vibe coding has gone mainstream, and AI-assisted coding is the future of software engineering. That said, we... ## How to Build a Documentation Website DevFeed: [How to Build a Documentation Website]() Original publisher: [Read original article]() Author: iHateReading Published: 2025-12-04T15:10:16Z Content type: tutorial Language: en Sources: [iHateReading]() Topics: [Documentation](), [Website](), [Development]() Tags: [backend](), [blockchain](), [buidling-documentation-website](), [coding](), [development](), [documentation](), [documentation-website-template-nextjs-tailwind-react-markdown](), [frontend](), [how-to](), [ihatereading](), [javascript](), [nextjs](), [node-js](), [product](), [programming](), [react](), [react-markdown](), [tailwind](), [typescript](), [web-development](), [website](), [website-template]() ### AI overview A tutorial about making a documentation website, prompted by a reader asking how to create one while using Mintlify and Fuma docs. ### Source excerpt Hello and welcome to today's blog Recently, I got an email from a person asking how he can make a documentation website. He was using Mintlify and Fuma docs, b... ## Creating a Custom Mobile Integration for a Board Game Using Ruby on Rails DevFeed: [Creating a Custom Mobile Integration for a Board Game Using Ruby on Rails]() Original publisher: [Read original article]() Author: Craig Hafer Published: 2025-12-04T14:00:00Z Content type: tutorial Language: en Sources: [Hashrocket]() Topics: [board-game](), [Ruby on Rails](), [Mobile](), [Tailwind CSS](), [Database](), [Stimulus]() Tags: [board-game-app](), [mobile](), [postgresql](), [rails](), [ruby](), [ruby-on-rails](), [stimulus](), [tailwind]() ### AI overview A tutorial on building a mobile version of the Analyzer mechanism from the 1973 Parker Brothers board game Billionare. The project uses Ruby on Rails, Tailwind, PostgreSQL, and Stimulus, with the goal of supporting a broader library of board game helpers. ### Source excerpt Picture this: you find a charming old board game at a garage sale, bring it home, gather some friends--and snap. The 50-year-old plastic components break instantly. You search the web for help to replace this fun and unique game mechanic but there's nothing to be found. So naturally, you roll up your sleeves and build your own mobile version. No one else does this? Just me? Well, in case you ever find yourself in a similar boat, I figured I would walk you through what I did when building my own mobile integration to the 1973 Parker Brothers classic Billionare. As I said, right when I went to try out this cool "new" board game for the first time, the plastic ends of the Analyzer snapped. The analyzer is basically a plastic rod with 2 floating spinners on them. The spinners, when rotated, will either land with a red face or a green face. You then refer to the chart to see what action to take. I thought this was such a unique way to give a random effect in a game, without relying on dice. It essentially is just a random binary spinner that counts up to 4. Here is what it looks like for reference: So, without any 4 sided die lying around, and not wanting to use a boring random number generator, my brain went right to what it knows best---Ruby on Rails. So without further ado, here's what I did and how you can do something similar yourself. Creating the app Sure, Rails could be considered overkill for such a simple app. But my idea is to allow this project to scale into a whole library of board game helpers that can all live within the same app. So, to start off I ran the old trusty rails new command, with a couple preferences I like to pass in to make my life easier as a developer. rails new board_game_library --css tailwind --database=postgresql One of the main tools I leveraged for this project besides Rails was Tailwind. Tailwind makes styling so easy. Here at Hashrocket Tailwind is pretty standard for all of us, so if you're interested in any tips or tricks, we have [Next page]()