The New Tailwind CSS V4 Blew My Mind ðŸĪŊ

āđāļŠāļĢāđŒ
āļāļąāļ‡
  • āđ€āļœāļĒāđāļžāļĢāđˆāđ€āļĄāļ·āđˆāļ­ 25 āļž.āļĒ. 2024

āļ„āļ§āļēāļĄāļ„āļīāļ”āđ€āļŦāđ‡āļ™ • 14

  • @Kulkarniankita
    @Kulkarniankita  8 āļŦāļĨāļēāļĒāđ€āļ”āļ·āļ­āļ™āļāđˆāļ­āļ™

    What do you think of the new Tailwind Alpha Release? What did you like and dislike about it? Let’s discuss! 👇

    • @alexfurtado1759
      @alexfurtado1759 4 āļŦāļĨāļēāļĒāđ€āļ”āļ·āļ­āļ™āļāđˆāļ­āļ™

      Hi , How do you install?
      You need install the regular tailwind with vite and react and the install the plugin?

  • @DThompsonDev
    @DThompsonDev 8 āļŦāļĨāļēāļĒāđ€āļ”āļ·āļ­āļ™āļāđˆāļ­āļ™ +2

    No config file is a big change! Tailwindcss setup always felt like it was too much for what it was. Really glad this process is so much simpler now! Great video Ankita!

    • @Kulkarniankita
      @Kulkarniankita  8 āļŦāļĨāļēāļĒāđ€āļ”āļ·āļ­āļ™āļāđˆāļ­āļ™

      Thanks Danny! Glad you liked it and yes excited for the Tailwind Config File gone :)

  • @JaySharma_javascript
    @JaySharma_javascript 8 āļŦāļĨāļēāļĒāđ€āļ”āļ·āļ­āļ™āļāđˆāļ­āļ™ +1

    Hi after listening about the alpha release i am in love with tailwind again 😅

    • @Kulkarniankita
      @Kulkarniankita  8 āļŦāļĨāļēāļĒāđ€āļ”āļ·āļ­āļ™āļāđˆāļ­āļ™ +1

      Haha yes 🙌 many love it as you don’t have to shift back and forth between CSS and JS!

  • @patilrohan
    @patilrohan 5 āļŦāļĨāļēāļĒāđ€āļ”āļ·āļ­āļ™āļāđˆāļ­āļ™

    Can you please also make a video on how you record the screen & your video editing workflow

  • @vinassefranche
    @vinassefranche 8 āļŦāļĨāļēāļĒāđ€āļ”āļ·āļ­āļ™āļāđˆāļ­āļ™ +2

    Hi! Thanks for the video.
    In our app, we were able to use the colors from the config in the JavaScript code. It was sometimes used to give some colors to libraries that we cannot style with classes. It seems like we are loosing this possibility with tailwind 4 and that we would need to duplicate the colors in the css and in JavaScript. Am I wrong on this?

    • @Kulkarniankita
      @Kulkarniankita  8 āļŦāļĨāļēāļĒāđ€āļ”āļ·āļ­āļ™āļāđˆāļ­āļ™

      Since they are exposed as native variables, you can access them using var(), I show an example at 7:06. Would you be able to pass using var?

    • @vinassefranche
      @vinassefranche 8 āļŦāļĨāļēāļĒāđ€āļ”āļ·āļ­āļ™āļāđˆāļ­āļ™

      var would work in css right? I can't have a string with the color value in it in the JavaScript code, right?

  • @mymorningjacket_
    @mymorningjacket_ 4 āļŦāļĨāļēāļĒāđ€āļ”āļ·āļ­āļ™āļāđˆāļ­āļ™

    How do we add plugins? like tailwind's typography?

  • @binaryfire
    @binaryfire 7 āļŦāļĨāļēāļĒāđ€āļ”āļ·āļ­āļ™āļāđˆāļ­āļ™

    Great video Ankita. Is it possible to create a new theme color from another CSS variable? For example let's say I have this in my page:
    :root {
    --my-custom-color: rgba(205,45,159,1);
    }
    Can I do something like this?
    @theme {
    --color-custom-1: var(--my-custom-color);
    }
    And would that generate corresponding Tailwind classes for bg colors, text colors and allow using the opacity classes with them too?

  • @shruh493
    @shruh493 8 āļŦāļĨāļēāļĒāđ€āļ”āļ·āļ­āļ™āļāđˆāļ­āļ™ +1

    Hii ankita, nice tutorial. Can you make your voice little bit softer?

    • @Kulkarniankita
      @Kulkarniankita  8 āļŦāļĨāļēāļĒāđ€āļ”āļ·āļ­āļ™āļāđˆāļ­āļ™

      Thanks Tejas, I’ll see what I can do next time!