Быстрая верстка сложного макета сайта из Figma

Как обойтись без фреймворков и сверстать адаптивный сайт? Практика рациональной работы и экономии кода. Будет весело!

1: Быстрая верстка сложного макета сайта из Figma. Часть 1

2: Быстрая верстка сложного сайта из Figma. Часть 2

#figma #web-development

What is GEEK

Buddha Community

Быстрая верстка сложного макета сайта из Figma

Как обойтись без фреймворков и сверстать адаптивный сайт? Практика рациональной работы и экономии кода. Будет весело!

1: Быстрая верстка сложного макета сайта из Figma. Часть 1

2: Быстрая верстка сложного сайта из Figma. Часть 2

#figma #web-development

Быстрая верстка сложного сайта из Figma - Часть 1

Как обойтись без фреймворков и сверстать адаптивный сайт? Практика рациональной работы и экономии кода. Будет весело!

Подключайся: https://wayup.in/library/workshop/lay…

#figma

Figma design kit built to integrate with Tailwind CSS

Hey everyone ✌🏻

Together with my friend, we developed a design kit in Figma specifically to be integrated with Tailwind CSS, a trending new utility first CSS framework.

You can find more information about the Tailwind CSS Figma design kit on Flowbite.

It’s open source 💙

#tailwind #figma #tailwind-figma #tailwind-ui #figma-ui #figma-ui-kit

Introducing Figma to React.

Figma is awesome for creating reusable UI elements and iterating fast. Features like Auto-Layout also bring it closer to the constraints present in the developer’s world.

When it comes to going to production though, there’s still a gap that handoff tools fail to bridge. Even though Figma has an inspect code mode to keep all teams eyes on a single tool, it can still be a headache to manually integrate designs.

I have been a Front-End passionate for many years, and always dreamed that design tools could provide code in modern frameworks. So I decided to create this concept. Before introducing it, let’s revisit an example of the problem I wanted to solve:

Working with Figma’s Inspect Mode

This is what it looks like to build a simple Card component in React, using Figma Inspect panel:

#ui #react #figma #ux #figma-plugin

Figma 101: Introduction to Figma | How to use Figma

Introduction to Figma [How to use Figma 101]

Knowing how to use Figma is a skill which can truly set you apart from other developers - and make your job a whole lot easier! That's why we've invited Creative Frontend Developer & Designer Kevin Canlas to give us a whistle-stop tour of the most essential features of Figma, which will allow you to hit the ground running using the design software today!

In this Figma 101, we'll talk about the basics of using design software and Kevin will demo some of the most useful features of Figma. By the end of the stream, you'll have gone from Figma newbie to dab hand at using design software.

We'll talk about:

🎨 Why learn Figma?
🎨 Figma setup 
🎨 Basic Figma tools
🎨 Layers
🎨 Groups
🎨 Frames
🎨 Colors
🎨 Typography
🎨 Vectors
🎨 Components
🎨 Styles
🎨 Keyboard shortcuts
🎨 Figma plugins
🎨 ..and more!

🔗 Useful links: 🔗 
🎨 Figma: https://www.figma.com/ 
 

#figma