Design Tools: Typography #65

ItsJonQ · 2020-10-15T20:35:06Z

Currently working through some ideas (both design and code) for Typography design tools.

Below are a collection of Story/prototypes. It's all very work-in-progress. Each prototype experiments with a different aspect of the control experience (e.g. UI or interaction or layout)

Think of these as a collection of "frames" or "artboards" a designer may have in Figma or Sketch.

ItsJonQ · 2020-10-23T19:54:42Z

The latest one is "Presets and Colors".
This one has been updated several times after a few design iteration cycles :)

https://g2-components.xyz/iframe.html?id=designtools-typographytools--ellipsis-with-color-alt-theme&viewMode=story

ItsJonQ added the design label Oct 15, 2020

ItsJonQ mentioned this issue Oct 16, 2020

Component: PresetInput + UnitInput #66

Closed

ItsJonQ mentioned this issue Nov 3, 2020

WP/Components with G2 Adapters #75

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Design Tools: Typography #65

Design Tools: Typography #65

ItsJonQ commented Oct 15, 2020 •

edited

Loading

ItsJonQ commented Oct 23, 2020

Design Tools: Typography #65

Design Tools: Typography #65

Comments

ItsJonQ commented Oct 15, 2020 • edited Loading

1. Options

2. Plus/Minus

3. BaseLine

4. BaseLine + Steppers

5. Plus/Minus Inline

6. Plus/Reset Inline

7. Plus/Minus Inline + Truncate Labels

8. Presets and Colors

9. Color Palette with Select dropdown

10. Panels

11. Color Panels: Shaded background on expand

12. Color Panels: Bordered on expand

ItsJonQ commented Oct 23, 2020

ItsJonQ commented Oct 15, 2020 •

edited

Loading