Questions tagged [google-material-design]

The tag has no usage guidance.

Filter by
Sorted by
Tagged with
0 votes
0 answers
27 views

Material 3 Icon to represent Manual mode?

I'm looking for an icon to represent the camera manual mode. Typically, it's represented by an M in a circle but I haven't found it in the Material 3 Icons set. Does the M in a circle exist in the ...
Noah's user avatar
  • 133
0 votes
1 answer
65 views

How does material design handles 3D object?

I am making a logo for my site. The site generator, Material for MkDocs, uses Material Design v1, so I want to use this design for consistency. The idea of the logo is a cube, representing objects (...
Ooker's user avatar
  • 1,853
2 votes
0 answers
55 views

What are the drop shadow parameters for material design shadows?

The material design docs describe two shadows, one cast by a key light, one cast by an ambient light. What are the drop shadow parameters that lead to those shadows for, lets say, a given elevation of ...
SePröbläm's user avatar
0 votes
1 answer
94 views

How would you represent reassignment with a Material UI icon?

Basically look for advice on which icon to use for reassignment of task within the Material UI icons.
msayers's user avatar
  • 11
1 vote
1 answer
159 views

What font does Google Material.io use to create icons?

Can the font used for text in Google's icons be downloaded from somewhere? For instance the font used on this icon: The icon comes from Google Material.io and the font used in this icon is used on ...
Brighter side's user avatar
0 votes
1 answer
94 views

What's this new button type called?

I've seen this type of buttons - no background and with an icon on top - in some places in Android 10 settings (Lineage OS 17, if that's important) and in one another application which uses slightly ...
squareboi's user avatar
2 votes
2 answers
129 views

What is a good icon to represent a toll?

I'm looking for an icon to represent a toll. I found this icon on Material Design under "toll", I'm actually curious as the only thing I see is a circle and another part of a circle. I'm thinking ...
Welz's user avatar
  • 9,989
5 votes
3 answers
7k views

Alternative to Google's "Material Design?"

I have really fallen in love with Google's "Material Design" when it comes to building UI for web/mobile/desktop apps. However, it was also the first time that I had encountered such a rich style ...
Tobin Shields's user avatar
2 votes
1 answer
1k views

What do the keylines on product icon design guidelines mean exactly?

What do the rectangles, squares and circles exactly represent on icon guidelines like this one? (I numbered them for practicality) source : https://developer.android.com/google-play/resources/icon-...
Sébastien's user avatar
0 votes
1 answer
103 views

What font is Google using across many apps (not Roboto)

I noticed Google is using this font specially in small CardViews and it's doing a very good job together with the rounded corners of the cards. Any one have an idea what this font is?
Bialy's user avatar
  • 109
0 votes
1 answer
665 views

Material Design: Actions on items in a table view

The problem with the FAB (some would say there are many) is that often you want to be able to invoke actions on an item in a table view. The fact that that has been precluded with this design is ...
Rob's user avatar
  • 101
1 vote
1 answer
3k views

what's the font used in the new Material Design, And how to get it?

What is the font used in the new google Material design interface? And if it's possible, how do I get it? This is the interface in case:
user10844047's user avatar
-2 votes
1 answer
112 views

What is this style called?

This is a repost from the ux stackexchange. I am trying to find the name of the style of the following websites. It's a mix of classic bootstrap and material design. But instead of full material ...
Chris's user avatar
  • 101
2 votes
0 answers
422 views

What does Material Design mean by 'action'?

For context, I'm a web developer implementing a project using Material-UI a React framework that implements Google's Material Design. One of the difficulties I'm having with the Material UI API ...
dwjohnston's user avatar
2 votes
0 answers
54 views

if I am using Material Design which top header bar component should I use?

I am a new designer and I am designing an application for iPhone devices. if I am using Material Design which top header bar component should I use, that one belongs to Material Design or iOS UI? ...
Farid S's user avatar
  • 67
-1 votes
1 answer
399 views

difference between Flat and Material design illustration [duplicate]

What's the difference between Flat and Material design illustration? Even, Are they any different? For example, what can I call the picture below?
Farid S's user avatar
  • 67
2 votes
2 answers
15k views

How can we download Google Material Design Color Palettes?

I've seen many users in YouTube tutorials that use Google's color palettes (see link below) for design in Illustrator. I searched similar things in Google search but found old links that don't have ...
Vikas's user avatar
  • 4,198
1 vote
2 answers
845 views

Primary color and accent from similar colors

I am new to material design and still learning. Is it a good idea to have the primary color and the accent from similar palettes, e.g Blue 500 and Light Blue A200? Or is the whole idea of the ...
user avatar
1 vote
1 answer
405 views

Shadow inconsistent in Material Design Guide

I have a problem with the material-design guideline. Some references about elevation/shadow seem inconsistent to me: At one point (https://material.io/design/environment/elevation.html#elevation-in-...
Mat2095's user avatar
  • 23
2 votes
1 answer
2k views

How to effectively create material elevation in mainly Inkscape or Illustrator?

How to create the material design elevation shadow in Inkscape mainly? Or alternatively in Illustrator? I have imitated the elevation shadow in Inkscape with the following settings: There are ...
Bluebug's user avatar
  • 680
4 votes
2 answers
802 views

Why does Android's material button's 'onPressed' state actually rising up instead of getting pushed down?

So like this: Why is this good? How is it decided to be like this way? I'm an Android developer and no matter whom I show my apps with these default Android buttons, everybody tells me I messed up ...
Adam Varhegyi's user avatar
-2 votes
1 answer
98 views

What are the best Practices in designing a Landing Page Mobile UI with a group of different buttons with different functionalities [closed]

For a Application I am working on, There are 5-6 differenr services which will be available to user as soon as they login. These services will be present as a seperate button , so that user just click ...
Ankit Passi's user avatar
6 votes
3 answers
3k views

Material Design: Should the status bar look different from the action bar?

I have often noticed that the status bar is a little darker than the action bar, is it a material design rule or a choice of the designer? Image's author: CommonsWare, from: https://stackoverflow.com/...
user avatar
-4 votes
2 answers
234 views

Can this Button be considered as Material design?

I've read the material.io page and tried it myself ,in a button on an android test - app. but there are 2 things which I think are nice but don't know if they fit into the material design guidlines: ...
Emanuel Graf's user avatar
2 votes
1 answer
795 views

How to choose the right color shades/tints for branding? - Part 2

I sincerely apologise for the duplicate question. I'm not sure how to add to the discussion on the original, and I don't have enough reputation to leave comments. Here is the original question: How ...
IOIIOOIO's user avatar
  • 163
0 votes
1 answer
648 views

How to create a material design style depth score in Photoshop?

According to Material Design guidelines for Icons Score Scored material elements have the illusion of depth without losing their geometric form. Scores should be centered on symmetrical ...
Sapnesh Naik's user avatar
5 votes
2 answers
3k views

How do you choose 'light' and 'dark' shades in Google Material Design

From the Material Design docs: To create contrast between elements, you can use lighter or darker tones of your primary color. The contrast between lighter and darker tones helps show division ...
ninjaPixel's user avatar
-3 votes
1 answer
580 views

How to make rounded rectangle in circle [closed]

Here i m working on meteor like design but i have hard time making those rounded design in planet
Kartik's user avatar
  • 79
2 votes
2 answers
6k views

Secondary color is a light version of the primary color

I'm working on an Android app that has an odd colour scheme, originally written for iOS with an iOS design. The primary colour is navy blue (#031740). They use light blue as an accent colour. Now, the ...
Herrbert74's user avatar
-1 votes
3 answers
258 views

What's this minimalist icon style called? [duplicate]

I've been seeing this "style" of minimalist icon more and more, with that "shadow" on the bottom right. Is there a specific name for this? Thanks.
Edmilson Rocha's user avatar
0 votes
3 answers
99 views

What could be good position for the view showing the duration in the layout?

So I have song name, album name , album art at left side of the layout, and three views consisting duration of the song, overflow menu button and a playlist button on the right side of the layout. I ...
Dushyant Suthar's user avatar
6 votes
2 answers
1k views

What font is used on this material design arabic RTL?

I want create design in arabic RTL with material design like this : I found that image in guideliness: https://material.google.com/style/writing.html what arabic font is used on that picture ? I ...
ryanw's user avatar
  • 163
0 votes
1 answer
2k views

How to make material design imagery with GIMP

all. I want to create material design imagery for my website, but don't have flashy tools like Photoshop or Illustrator. However, I do have GIMP 2 on Ubuntu. Examples of material design imagery can ...
Bryson Shier's user avatar
6 votes
3 answers
4k views

Where are the light sources located in Material design?

Google says that Key lights create directional shadows, and Ambient light create soft shadows from all angles. Referring specifically to the image below, where are the Key & Ambient Light ...
Saurabh Kautilya Gupta's user avatar
-1 votes
1 answer
55 views

Meaning of "material design"

I have seen several websites and smartphone apps claim that they employ a "material design". Is this a lose term, or not? What exactly does this term mean our imply?
Jack Maddington's user avatar
0 votes
1 answer
80 views

Is it fair to use accent colors to borders in material design?

I'm trying to create a widget styles in dashboard design.is it fair to use accent colors to borders instead of background color.when i try to use as bachground color it doesnt compliment the other ...
Vivekraj K R's user avatar
0 votes
4 answers
45k views

How can I download the material icon font?

I am unable to download the material icon fonts. Can anyone share a working link? I am only using downloaded fonts.
nagha's user avatar
  • 45
-3 votes
1 answer
516 views

Android Material Design Guidelines [closed]

My company has told me to design an app for them with Material Design Guidelines & I don't know from where to start. Thing I want to know : Note : Others ( The things I don't know, so please ...
 Pv vimal nair's user avatar
0 votes
1 answer
471 views

Which would be a better Material Design bottom nav on desktop color combination?

Which colors combination are better for the bottom navigation bar, while in expanded state, taking in consideration the user experience:
Marcos J.C Kichel's user avatar
0 votes
0 answers
313 views

Material Design App Slicing - Android

As we all know, Google have released a material design UI/UX platform for developers. What are the image sizes that I have to follow to slice them for the various resolutions of android devices?
Rishab's user avatar
  • 1,754
8 votes
1 answer
950 views

How to choose the right color shades/tints for branding?

I’ve read a lot about color theoretical methods to pick a harmonic color palette (e.g. for branding), but I always wondered how to pick the corresponding shades and tints (see Google’s material design ...
debite's user avatar
  • 253
0 votes
1 answer
478 views

Get the closest swatch from an PNG color set

So I have a set of PNG colors provided to me. But as agreed to our design guidelines, we shall use the Material colors provided by Google. So if example that there exists a "lime" color from the PNG ...
anobilisgorse's user avatar
0 votes
1 answer
1k views

Roboto Draft Vs. Roboto

So i have a question, i just hit inspect element on the Material Design Guide because i wanted to know the specs of the Dividers (I know those are very well explained in the guide) but i wanted to ...
Cristobal Lemoine's user avatar
1 vote
0 answers
387 views

Does the Floating Action Button in Material Design have a light?

OK, so the "Card" in Material Design cast a shadow because of 2 lights, because well... if something has a shadow it's because that thing is blocking the light. Does the Floating Action Button (FAB) ...
Cristobal Lemoine's user avatar
1 vote
2 answers
2k views

Can I use material design for both Android and iOS?

I am currently designing an application for Android and iOS. I like Google's Material Design and use of colors. Can I use the same style and look & fill for iOS apps except the navigation system ...
Samir Ghodiya's user avatar
2 votes
1 answer
1k views

Material design icon alignment in its box for creating android assets

I saw something in material design guidelines that bothers me - the way how the icons are aligned to global margins: The alignment is related to the icon box and not the icon itself, for example: ...
ErnestW's user avatar
  • 23
0 votes
1 answer
138 views

Icons for cell padding adjustments

I am at a dead end right now, with 2 icons. I have a table, above the table I have 2 icons, the 2 icons will be buttons that will change the padding of the table cells. Just like in gmail, you ...
fjlsjf's user avatar
  • 3
1 vote
0 answers
251 views

Are there mathematical models behind Google material design metrics?

Google's Material Design guidelines such as Typography - Style - Google design guidelines or Metrics & keylines - Layout - Google design guidelines contains many ad hoc metrics for font sizing, ...
Dmitri Zaitsev's user avatar
13 votes
1 answer
3k views

What is meant by 'designing an icon at 100% scale'?

From the Android's Material Design guide, System icons are displayed at 24dp. When creating icons, it’s important to design at 100% scale for pixel-accuracy. What is meant by designing at 100% ...
Solace's user avatar
  • 327
1 vote
0 answers
32 views

What are the specs for material design icon? [duplicate]

I would like to draw an app launcher icon with Inkscape but the official guide seems to miss some specs. In my understanding, to design a material design icon I just need to put some shapes together ...
Perqin's user avatar
  • 111