Request details

Components & Design systems

It wode be really good that designers to have capabilities to design with components which can be used separately or combined into a new component because today technologies are relying on this concepts example React, ReactNative ... This feature would give designers the capability to build consistent design systems.

29 votes
Sign in
Check!
(thinking…)
Reset
or sign in with
  • facebook
  • google
    Password icon
    Signed in as (Sign out)

    We’ll send you updates on this idea

    ESersic shared this idea  ·   ·  Flag idea as inappropriate…  ·  Admin →

    4 comments

    Sign in
    Check!
    (thinking…)
    Reset
    or sign in with
    • facebook
    • google
      Password icon
      Signed in as (Sign out)
      Submitting...
      • Vincent Spallek commented  ·   ·  Flag as inappropriate

        Another aspect to consider is the philosophy of OOCSS:

        1. Create design tokens (color, font specs)
        2. Utilizing these tokens, create CSS classes as defined by OOCSS. Example: protective-margin for a margin around clickable elements; clickable-area for a minimum width and height and mouse cursor; button-background for the colors for the different states. Then we can create another class button-background--emph for an emphasized button without having to repeat all the other specifications that won't change
        3. Combine those classes to build-up the elements. With this approach, they will become much more consistent with little effort <button class="protective-margin clickable-area button-background">Normal button</button>, <button class="protective-margin clickable-area button-background--emph">Important button</button>
        4. Use those elements to build-up the screens and flow

        It would be great if something like this would be supported by XD. Other Adobe tools like InDesign allow it to assign one style (e.g. paragraph style) to each element, but not several. Even in Dreamweaver, I can only pick one CSS class when using the design view.

        Related: https://adobexd.uservoice.com/forums/353007-adobe-xd-feature-requests/suggestions/13245423-import-html-from-url-as-editable-static-content

      Feedback and Knowledge Base