Best of FigmaOctober 2024

  1. 1
    Article
    Avatar of communityCommunity Picks·2y

    Best design system examples

    Exploring top design system examples to help build or improve your own, this post covers the essentials like consistency, efficiency, scalability, collaboration, and quality control. Featuring IBM's Carbon, Atlassian's, and Adobe's Spectrum design systems, it offers insights into unique approaches and best practices in design systems.

  2. 2
    Article
    Avatar of phProduct Hunt·2y

    Tailwind Sync - Figma variables to Tailwind in one click

    Tailwind Sync is a new tool that allows users to sync Figma variables with Tailwind CSS in just one click. The tool was launched on October 1st, 2024, and aims to streamline the workflow between design and development teams.

  3. 3
    Article
    Avatar of communityCommunity Picks·2y

    ui kit for Figma

    Enhance design and development workflows with the comprehensive shadcn/ui kit for Figma. This kit includes over 2000 components, 1400+ icons, and 900+ design assets. It features light and dark modes, customizable variables, and supports multi-brand design systems. The dedicated Figma plugin allows for easy theme exporting, bridging the gap between design and code. Regular updates keep the kit aligned with the latest Figma and shadcn/ui components.

  4. 4
    Article
    Avatar of communityCommunity Picks·2y

    realvjy/figma-plugin: Figma plugin repository in a cool retro look

    An overview of a Figma plugin repository that features a retro look, including notifications and forking capabilities. It highlights the accessibility of the repository being public.

  5. 5
    Video
    Avatar of designcourseDesignCourse·2y

    Taking your Buttons to the Next Level with Rive

    Learn how to create highly interactive and animated hover effects for buttons using Rive. This guide walks you through the process of designing in Figma, importing assets into Rive, creating animations across different states, and integrating the final output into a web project using HTML, CSS, and JavaScript. Aimed at UI/UX designers and web developers, this approach can enhance user engagement and reinforce brand identity.

  6. 6
    Article
    Avatar of figmaFigma·2y

    Figma on Figma: Our approach to designing UI3

    Figma's latest interface, UI3, reimagines the user experience by minimizing distractions and placing work at the center stage. Significant changes include fixed but resizable docked panels, the introduction of Minimize UI for distraction-free work, and a revamped properties panel with reorganized features. The update has been guided by extensive user feedback, the design team's vision, and real-world testing during the open beta phase. Users can opt-out of UI3 during the beta to adapt at their own pace, with the full rollout planned for October 10.