# Tailwind CSS

> Come larch usa Tailwind CSS: le interfacce dell’app web di Hiki, dell’app desktop Bridddge e della dashboard di Scout, con componenti shadcn/ui e Radix.

URL: https://larch.ee/it/technologies/tailwind-css/

larch costruisce interfacce con Tailwind CSS. L’app web di Hiki, l’app desktop Bridddge e la dashboard di Scout hanno tutte lo stile fatto con le utility di Tailwind, con sopra componenti shadcn/ui o Radix.

- Prodotti realizzati: 3
- Versioni: Tailwind 3 e 4
- Componenti: shadcn/ui · Radix
- Piattaforme: Web · macOS
- shadcn/ui in Hiki: 16 componenti

## Realizzati con Tailwind CSS

Tre prodotti, un solo strato di stile. Ogni nostro prodotto con un’interfaccia ha lo stile fatto con Tailwind. L’eccezione è seo-mcp: non ha un’interfaccia propria e gira dentro il tuo editor con IA.

### [Hiki](https://larch.ee/it/work/hiki/)

L’app web di Hiki usa Tailwind 4 con 16 componenti shadcn/ui, con un tema neubrutalista deciso nel catalogo, nel marketplace e nella mappa dei negozi.

- Anno: 2025
- Stack: Next.js, React, TypeScript, Tailwind CSS, Kotlin, Jetpack Compose, FastAPI, Python, MongoDB, Firebase, Google Cloud
- Prodotto online: https://hiki.world

### [Bridddge](https://larch.ee/it/work/bridddge/)

L’app desktop Bridddge usa Tailwind 3 con shadcn/ui, impostato con angoli squadrati e un accento blu perché i componenti abbiano l’aspetto di Bridddge.

- Anno: 2025
- Stack: Electron, React, TypeScript, shadcn/ui, Tailwind CSS, SQLite, Firebase, MCP, Claude AI
- Prodotto online: https://bridddge.com

### [Scout](https://larch.ee/it/work/scout/)

La dashboard di Scout, con la sua pipeline Kanban in tempo reale e il registro attività, è costruita con Tailwind 4.1 e le primitive di Radix.

- Anno: 2025
- Stack: Next.js, React, TypeScript, Tailwind CSS, SQLite, Playwright, AI agents, Gemini API

## Servizio correlato

### [Sviluppo di piattaforme web](https://larch.ee/it/services/web-platform-development/)

Piattaforme veloci e robuste che assecondano la crescita del tuo business, invece di frenarla.

Cosa ottieni:

- **Piattaforme SaaS, dashboard in tempo reale e app multilingue**: La dashboard in tempo reale di Scout e il catalogo multilingue di Hiki, ognuno con il suo look, dalle stesse classi utility.
- **Tutto lo stack, dal front end al database**: Per Hiki, il front end in Tailwind poggia su un back end in FastAPI e MongoDB, tutto sviluppato da un solo team.
- **Rilasciate, monitorate e scalate, non solo sviluppate**: L’app web di Hiki viene rilasciata su Cloud Run tramite Cloud Build a ogni push su main.

## Come usiamo Tailwind CSS

Un look per ogni prodotto. Tailwind dà a ogni prodotto il suo look a partire da un unico set di mattoncini, e tiene gli stili accanto ai componenti che li usano.

### Hiki: un look manga su Tailwind 4

L’app web di Hiki gira su Next.js 16 con Tailwind 4. Sopra ci sono 16 componenti shadcn/ui con un tema neubrutalista: bordi marcati, ombre sfalsate e un look ispirato ai manga che attraversa il catalogo, il marketplace e la mappa dei negozi. I componenti stanno nel progetto invece che in un pacchetto, così il team li modifica come qualsiasi altro codice.

### Bridddge: un’app desktop con una sua identità

Bridddge è un’app Electron per macOS, con lo stile fatto in Tailwind 3 e shadcn/ui. Il suo tema porta a zero il raggio degli angoli e usa un accento blu, così gli stessi componenti sembrano Bridddge e non un kit standard. Il plugin tailwindcss-animate aggiunge le piccole animazioni.

### Scout: una dashboard che mostra molto in una volta

L’interfaccia di Scout è Next.js 15 con Tailwind 4.1, e le primitive di Radix le danno mattoncini accessibili. Mette molto sullo schermo: un setup guidato in sette passaggi, una pipeline Kanban con drag and drop, una dashboard analitica e un registro in tempo reale di ogni azione dell’agente.

### Perché Tailwind

Gli stili stanno nel markup, accanto al componente a cui appartengono, così quando un componente se ne va non resta nulla. Al browser arrivano solo le classi che un prodotto usa, e un nuovo tema è una manciata di token invece di una riscrittura. È così che tre prodotti molto diversi restano veloci da modificare. Anche questo sito, larch.ee, ha lo stile fatto con Tailwind 4.

## Altre tecnologie

Usate al suo fianco. Tutti e tre i prodotti abbinano Tailwind a React, e Hiki e Scout anche a Next.js. Scopri cos’altro ci abbiamo costruito.

- [React](https://larch.ee/it/technologies/react/): Le interfacce di Hiki e Scout, e quella dell’app desktop Bridddge.
- [Next.js](https://larch.ee/it/technologies/nextjs/): Il front end del catalogo multilingue di Hiki e l’app web di Scout, entrambi sull’App Router di Next.js.
- [Tutte le tecnologie](https://larch.ee/it/technologies/): Undici tecnologie, ognuna in uso in un prodotto che abbiamo rilasciato.

## Come iniziare

Raccontaci cosa vuoi lanciare. Porta l’idea. Ti diremo come la costruiremmo e cosa serve.

- Prenota una call di 30 minuti: https://calendly.com/nicholas-stackwise/30min
- Email: nicholas@larch.ee
