Questions tagged [angular-material-theming]
30 questions
11
votes
1 answer
Angular Material Typography not being set correctly
I am trying to implement Angular Material Typography however I have been having some difficulties and I am unsure what may be the issue.
I followed the instructions provided by Angular here however I run into a problem. The problem is that it looks…

L1ghtk3ira
- 3,021
- 6
- 31
- 70
9
votes
2 answers
angular material changing default font color
i am using angular material and a bit lost at theming. I am using the prebuilt indigo-pink theme which is included in my styles.scss as below
@import "~@angular/material/prebuilt-themes/indigo-pink.css";
Based on the doc i created a new file…

Moblize IT
- 1,140
- 2
- 18
- 44
4
votes
2 answers
Why My custom colors are not working in my Angular material theme?
I trying to add more color to my angular material theme, I've added the success color in my style.scss by the map.deep-merge fucntion
// Custom Theming for Angular Material
// For more information: https://material.angular.io/guide/theming
@use…

geraktOfRivia
- 325
- 3
- 7
- 19
3
votes
1 answer
Angular Material cant change background color with theme
I've been tring to make a custom theme for my site but nothing will effect the background color. This is my theme:
@import '~@angular/material/theming';
@include mat-core();
$warn: mat-palette($mat-red);
$dark-primary: mat-palette($mat-grey,…

amedeiros
- 167
- 3
- 13
3
votes
1 answer
Angular material theme override
I found in the _theming.scss file
$mat-light-theme-background: (
status-bar: map_get($mat-grey, 300),
app-bar: map_get($mat-grey, 100),
background: map_get($mat-grey, 50),
hover: rgba(black, 0.04), // TODO(kara): check style with…

dinamix
- 651
- 8
- 22
2
votes
1 answer
How to propagate graphical theme efficiently in Angular with Sass?
Scenario :
I have an app which in Id like to use 3 different graphical themes.
To propagate my themes, I'm using 3 different classes that I apply to my root component, let call those classes .themeA, .themeB, .themeC. For every themes, I have a…

flemgs
- 55
- 7
2
votes
3 answers
@import '~@material/theme'; in styles.css doesn't work
I got the error when I follow the instruction online
https://material.angular.io/guide/theming
ERROR in ./src/styles.scss…

ckky1213
- 321
- 5
- 14
1
vote
0 answers
Angular Material 15 theming, list-theme
I have this error when I want to compile.
The error comes from the line
@include mat.list-theme($cdk-sidemenu-theme);
I tried to consult the documentation, but it didn't really help me.
I assume the error is from the parameter
I am using angular…

TheKosto
- 21
- 2
1
vote
1 answer
Material Design compact: Select / DropDown doesn't react on density
I use Material design in my Angular app.
Some elements like the mat-select have a very high density - these elements are anything but compact.
The common way to render the layouts more compact in Material design is the density-property of the…

Konrad
- 4,329
- 10
- 54
- 88
1
vote
1 answer
How to let my Angular libraries use the Angular Material Theme of the root app?
I'm using Angular Material Components like inside my own Angular libraries. So far no problem. But is there a way so the libraries use the Angular Material Theming of the root app they are embedded in? The goal is to inherit the Theming of the root…

Fabian Röhrle
- 21
- 3
1
vote
0 answers
How to build a custom material theme based on 8 colors
I have this color palete provided by designer
As you can see it contains 8 colors.
I look up in to the angular material theming guide but you may only provide primary, accent colors.
$my-theme: mat.define-light-theme((
color: (
primary:…

Sergino
- 10,128
- 30
- 98
- 159
1
vote
1 answer
SASS - Passing map through map_merge results in similar looking but not equivalent map
I'm trying to write a function to dynamically apply some transformations to a previously defined map of colours for an angular material theme. The problem is that the result that comes out of the function is wrong, somehow.
I've printed the result…

Tantelope
- 597
- 1
- 8
- 24
1
vote
1 answer
Generate theme on demand angular 8
I have requirement to take color palette from config file which contains colors based on domain.
Config file is json file placed at root of the project.
In angular material 1 there is a way to generate theme on demand by lazy-generate-theme
Is…

Ankur Akvaliya
- 2,989
- 4
- 28
- 53
1
vote
1 answer
Angular Material - All acceptable arguments for `mat-palette()`
In the Angular Material custom theming documentation, we are setting the primary color as indigo like this:
$candy-app-primary: mat-palette($mat-indigo);
Where can i refer all acceptable arguments for the mat-palette() function?
I wanted to know…

shaheer shukur
- 1,077
- 2
- 12
- 19
1
vote
2 answers
Create Angular Theme without using Material's palette colors
Is it possible to create a theme in angular material with your own hex codes?
instead of something like this
$my-theme-primary: mat-palette($mat-blue, 800);
$my-theme-accent: mat-palette($mat-orange);
$my-theme-warn:…

bradley
- 445
- 1
- 9
- 17