---
title: Taking Flight with Tailwind CSS
description: An introduction to the utility-first approach to writing CSS with a focus on the Tailwind CSS framework.
speakerdeck:
  id: 10ca51f23560443d83b898a92929b4b3
  ratio: '1.77777777777778'
  url: https://speakerdeck.com/opdavies/taking-flight-with-tailwind-css
video:
  type: youtube
  id: lgsvKtpQp3U
tags: [css, tailwind, meetup]
events:
  - name: Drupal Bristol
    location: Bristol, UK
    date: 2018-01-17
    url: https://www.drupalbristol.org.uk

  - name: PHP South Wales
    location: Cardiff, UK
    date: 2018-07-31
    url: https://www.phpsouthwales.uk

  - name: Cheltenham WordPress Meetup
    location: Cheltenham, UK
    date: 2019-04-17
    url: https://www.meetup.com/Cheltenham-WordPress-Meetup

  - name: WordCamp Bristol 2019
    location: Bristol, UK
    date: 2019-05-18
    url: https://2019.bristol.wordcamp.org

  - name: Blue Conf 2019
    location: Cardiff, UK
    date: 2019-06-07
    url: https://blueconf.co.uk

  - name: CMS Philly
    location: Philadelphia, USA
    date: 2020-05-01
    url: https://cmsphilly.org
    online: true

  - name: PHP Hampshire
    location: Portsmouth, UK
    date: 2020-07-08
    url: https://www.meetup.com/meetup-group-yzpbvTYv/events/271430269
    online: true

  - name: Drupal Yorkshire
    location: Leeds, UK
    date: 2020-08-20
    url: https://www.meetup.com/DrupalYorkshire/events/zwzsfpybclbbc
    online: true

  - name: DigitalCamp Atlanta 2020
    location: Atlanta, GA
    date: 2020-09-11
    url: https://www.drupalcampatlanta.com/2020/sessions/taking-flight-tailwind-css
    online: true

  - name: Bristol JS
    location: Bristol, UK
    date: 2020-09-30
    url: https://techtalks.io/events/f8e26038-2561-484e-8a74-7a1e3a0369b8
    online: true

  - name: 'Drupal Virtual Cafe #3'
    location: Kyiv, Ukraine
    date: 2020-10-15
    url: https://groups.drupal.org/ukraine
    online: true

  - name: PHP Cambridge
    location: Cambridge, UK
    date: 2021-01-19
    url: https://www.meetup.com/phpcambridge
    online: true

  - name: Nashville PHP
    location: Nashville, TN, USA
    date: 2021-02-09
    url: https://www.meetup.com/nashvillephp/events/kzkdwryccdbmb
    online: true
sortable_date: 2021-02-09
meta:
  og:
    title: Taking Flight with Tailwind CSS
    description: An introduction to utility CSS and Tailwind.
    type: website
    image:
      url: '/images/talks/taking-flight-tailwind.jpg'
      width: 2560
      height: 1440
      type: 'image/png'
---

An introduction to utility class and component based styling, and how to soar with [Tailwind CSS][1].

Things we’ll cover:

- Advantages and disadvantages to utility based styling and Tailwind.
- How to install Tailwind and add it to your build process using tools such as Symfony Encore and Laravel Mix.
- How to configure and customise Tailwind for your project.
- How to promote repeating classes into re-usable components for better maintainability.
- Strategies to control the file size, and using external tools like PurgeCSS.

Also, if time allows:

- How to extend Tailwind and add extra classes with community written plugins.
- How to write and test your own custom plugins.

[1]: https://tailwindcss.com