0

I'm beginning with Angular material.After install dependencies I can use the components but cant't see any colors.

First I've installed the theme at styles.css :

@import "~@angular/material/prebuilt-themes/purple-green.css";

But witth no results.

Then I used a reference at index.html :

  <link href="node_modules/@angular/material/prebuilt-themes/indigo-pink.css" rel="stylesheet">

No results too. All remains black and white.

Any ideas ?

Improve this question
1
  • are you using angular-cli ? Commented Sep 21, 2017 at 13:57

3 Answers 3

Reset to default
2

In your .angular-cli.json add the following in your styles entry: 

styles: [
    "../node_modules/@angular/material/prebuilt-themes/indigo-pink.css"
]

then run ng build in your terminal window.

Improve this answer
Sign up to request clarification or add additional context in comments.

2 Comments

I did that but with no results.
no need of "../". change the path to "node_modules/@angular/material/prebuilt-themes/indigo-pink.css"
2

please tell more about your project, which version of angular? surely you are doing wrong, if it's angular cli project, you need to add in in .angular-cli.json, you should see a property named styles, add it there

Improve this answer

5 Comments

Shure. @angular/cli: 1.4.2 node: 6.10.2 os: win32 x64 @angular/animations: 4.4.3 @angular/cdk: 2.0.0-beta.10 @angular/common: 4.3.6 @angular/compiler: 4.3.6 @angular/core: 4.3.6 @angular/forms: 4.3.6 @angular/http: 4.3.6 @angular/material: 2.0.0-beta.10 @angular/platform-browser: 4.3.6 @angular/platform-browser-dynamic: 4.3.6 @angular/router: 4.3.6 @angular/cli: 1.4.2 @angular/compiler-cli: 4.3.6 typescript: 2.2.2
and did you add it to styles in angular-cli.json and run 'ng serve'?
can I have your code? app.module, style.css, angular-cli.json, app.component.html? not all of your project, I did it now and it works for me.
Hi @Faisal , I think the problem was related with the component that I was testing ( the menu ) that is really black and white. Thank you !
Hi @StetHD .I think the problem was related with the component that I was testing ( the menu ) that is really black and white. Thank you !
1

What happens if you set a color attribute to your component like e.g.

<button md-raised-button color="primary">Click me!</button>

This should normally result in a colored button:

enter image description here

Improve this answer

1 Comment

Hi Phillip, completely normal and colored as yours.I think the problem was related with the component that I was testing ( the menu ) that is really black and white. From you sample I tested now several others components and all are normal ( colored ).Thank you

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.