domain | tailwindcss.com |
summary | Learn more , responsive design sm md lg xl 2xl workcation.com Tailwind UI - Official Tailwind CSS Components Workcation - Find a trip that suits you Headless UI Unstyled, fully accessible UI components 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 main class py-6 px-4 sm:p-6 md:py-10 md:px-8 div class max-w-4xl mx-auto grid grid-cols-1 lg:max-w-5xl lg:gap-x-20 lg:grid-cols-2 div class relative p-3 col-start-1 row-start-1 flex flex-col-reverse rounded-lg bg-gradient-to-t from-black75 via-black0 sm:bg-none sm:row-start-2 sm:p-0 lg:row-start-1 h1 class mt-1 text-lg font-semibold text-white sm:text-slate-900 md:text-2xl dark:sm:text-white Beach House in Collingwood h1 p class text-sm leading-4 font-medium text-white sm:text-slate-500 dark:sm:text-slate-400 Entire house p div div class grid gap-4 col-start-1 col-end-3 row-start-1 sm:mb-6 sm:grid-cols-4 lg:gap-6 lg:col-start-2 lg:row-end-6 lg:row-span-6 lg:mb-0 img src beach-house.jpg alt class w-full h-60 object-cover rounded-lg sm:h-52 sm:col-span-2 lg:col-span-full loading lazy img src beach-house-interior-1.jpg alt class hidden w-full h-52 object-cover rounded-lg sm:block sm:col-span-2 md:col-span-1 lg:row-start-2 lg:col-span-2 lg:h-32 loading lazy img src beach-house-interior-2.jpg alt class hidden w-full h-52 object-cover rounded-lg md:block lg:row-start-2 lg:col-span-2 lg:h-32 loading lazy div dl class mt-4 text-xs font-medium flex items-center row-start-2 sm:mt-1 sm:row-start-3 md:mt-2.5 lg:row-start-2 dt class sr-only Reviews dt dd class text-indigo-600 flex items-center dark:text-indigo-400 svg width 24 height 24 fill none aria-hidden true class mr-1 stroke-current dark:stroke-indigo-500 path d m12 5 2 5h5l-4 4 2.103 5L12 16l-5.103 3L9 14l-4-4h5l2-5Z stroke-width 2 stroke-linecap round stroke-linejoin round svg span 4.89 span class text-slate-400 font-normal 128 span span dd dt class sr-only Location dt dd class flex items-center svg width 2 height 2 aria-hidden true fill currentColor class mx-3 text-slate-300 circle cx 1 cy 1 r 1 svg svg width 24 height 24 fill none stroke currentColor stroke-width 2 stroke-linecap round stroke-linejoin round class mr-1 text-slate-400 dark:text-slate-500 aria-hidden true path d M18 11.034C18 14.897 12 19 12 19s-6-4.103-6-7.966C6 7.655 8.819 5 12 5s6 2.655 6 6.034Z path d M14 11a2 2 0 1 1-4 0 2 2 0 0 1 4 0Z svg Collingwood, Ontario dd dl div class mt-4 col-start-1 row-start-3 self-center sm:mt-0 sm:col-start-2 sm:row-start-2 sm:row-span-2 lg:mt-6 lg:col-start-1 lg:row-start-3 lg:row-end-4 button type button class bg-indigo-600 text-white text-sm leading-6 font-medium py-2 px-3 rounded-lg Check availability button div p class mt-4 text-sm leading-6 col-start-1 sm:col-span-2 lg:mt-6 lg:row-start-4 lg:col-span-1 dark:text-slate-400 This sunny and spacious room is for those traveling light and looking for a comfy and cosy place to lay their head for a night or two.abbr 128 p h2 class text-slate-500 dark:text-slate-400 text-sm leading-6 truncate Scaling CSS at Heroku with Utility Classes h2 p class text-slate-900 dark:text-slate-50 text-lg Full Stack Radio p div div div class space-y-2 div class relative div class bg-slate-100 dark:bg-slate-700 rounded-full overflow-hidden div class bg-cyan-500 dark:bg-cyan-400 w-12 h-2 role progressbar aria-label music progress aria-valuenow 1456 aria-valuemin 0 aria-valuemax 4550 div div div class ring-cyan-500 dark:ring-cyan-400 ring-2 absolute left-12 top-12 w-4 h-4 -mt-2 -ml-2 flex items-center justify-center bg-white rounded-full shadow div class w-1.5 h-1.5 bg-cyan-500 dark:bg-cyan-400 rounded-full ring-1 ring-inset ring-slate-9005 div div div div class flex justify-between text-sm leading-6 font-medium tabular-nums div class text-cyan-500 dark:text-slate-100 24:16 div div class text-slate-500 dark:text-slate-400 75:50 div div div div div class bg-slate-50 text-slate-500 dark:bg-slate-600 dark:text-slate-200 rounded-b-xl flex items-center div class flex-auto flex items-center justify-evenly button type button aria-label Add to favorites svg width 24 height 24 path d M7 6.931C7 5.865 7.853 5 8.905 5h6.19C16.147 5 17 5.865 17 6.931V19l-5-4-5 4V6.931Z fill currentColor stroke currentColor stroke-width 2 stroke-linecap round stroke-linejoin round svg button button type button class hidden sm:block lg:hidden xl:block aria-label Previous svg width 24 height 24 fill none path d m10 12 8-6v12l-8-6Z fill currentColor stroke currentColor stroke-width 2 stroke-linecap round stroke-linejoin round path d M6 6v12 stroke currentColor stroke-width 2 stroke-linecap round stroke-linejoin round svg button button type button aria-label Rewind 10 seconds svg width 24 height 24 fill none path d M6.492 16.95c2.861 2.733 7.5 2.733 10.362 0 2.861-2.734 2.861-7.166 0-9.9-2.862-2.733-7.501-2.733-10.362 0A7.096 7.096 0 0 0 5.5 8.226 stroke currentColor stroke-width 2 stroke-linecap round stroke-linejoin round path d M5 5v3.111c0 .491.398.889.889.889H9 stroke currentColor stroke-width 2 stroke-linecap round stroke-linejoin round svg button div button type button class bg-white text-slate-900 dark:bg-slate-100 dark:text-slate-700 flex-none -my-2 mx-auto w-20 h-20 rounded-full ring-1 ring-slate-9005 shadow-md flex items-center justify-center aria-label Pause svg width 30 height 32 fill currentColor rect x 6 y 4 width 4 height 24 rx 2 rect x 20 y 4 width 4 height 24 rx 2 svg button div class flex-auto flex items-center justify-evenly button type button aria-label Skip 10 seconds svg width 24 height 24 fill none path d M17.509 16.95c-2.862 2.733-7.501 2.733-10.363 0-2.861-2.734-2.861-7.166 0-9.9 2.862-2.733 7.501-2.733 10.363 0 .38.365.711.759.991 1.176 stroke currentColor stroke-width 2 stroke-linecap round stroke-linejoin round path d M19 5v3.111c0 .491-.398.889-.889.889H15 stroke currentColor stroke-width 2 stroke-linecap round stroke-linejoin round svg button button type button class hidden sm:block lg:hidden xl:block aria-label Next svg width 24 height 24 fill none path d M14 12 6 6v12l8-6Z fill currentColor stroke currentColor stroke-width 2 stroke-linecap round stroke-linejoin round path d M18 6v12 stroke currentColor stroke-width 2 stroke-linecap round stroke-linejoin round svg button button type button class rounded-lg text-xs leading-6 font-semibold px-2 ring-2 ring-inset ring-slate-500 text-slate-500 dark:text-slate-100 dark:ring-0 dark:bg-slate-500 1x button div div Customization Extend it, tweak it, changeĀ it. |
title | Tailwind CSS - Rapidly build modern websites without ever leaving your HTML. |
description | Tailwind CSS is a utility-first CSS framework for rapidly building modern websites without ever leaving your HTML. |
keywords | class, text, tailwind, slate, flex, developer, stroke, button, center, dark, font, width, start, white, full, design, grid |
upstreams |
jasonlbeggs.com, laravel.com |
downstreams |
|
nslookup | A 172.67.41.16, A 104.22.20.144, A 104.22.21.144 |
created | 2024-11-30 |
updated | 2025-01-01 |
|
|