---
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:
  id: C20QZbGlmZ8
  type: youtube
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

  - name: Bristol Software Development Meetup
    location: Bristol, UK
    date: 2023-02-16
    url: https://www.meetup.com/south-wales-tech/events/291092930

  - name: Norfolk Developers Conference
    location: Norwich, UK
    date: 2023-02-23
    url: https://nordevcon.com
meta:
  og:
    title: Taking Flight with Tailwind CSS
    description: An introduction to utility CSS and Tailwind.
    type: website
    image:
      url: '%site.assets_url%/assets/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 CSS.
- How to add Tailwind CSS to your project and configure and customise it.
- How to avoid duplication by moving repeating classes into re-usable components for better maintainability.
- How to extend Tailwind CSS and add extra classes with community-written plugins.
- How to write and test your own custom project-specific plugins.

[1]: https://tailwindcss.com