1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.
  2. Anuncie Aqui
    Anuncie aqui você Também: fdantas@4each.com.br

Simple way to set color palette for PrimeNG 18/19 theme?

Discussão em 'Angular' iniciado por kshetline, Maio 19, 2025.

  1. kshetline

    kshetline Guest

    Here's my ApplicationConfig:

    export const appConfig: ApplicationConfig = {
    providers: [
    provideAnimationsAsync(),
    providePrimeNG({
    theme: {
    preset: Aura,
    options: {
    // I'd like something simple here, like:
    // palette: "sky"
    }
    }
    }),
    provideHttpClient()
    ]


    The PrimeNG website lets you experiment with different palette (as well as different themes) through an interface like this:

    [​IMG]

    The tooltip shows the palette I like is called "sky", but I can't find anything in the API description that tells me where (if anywhere) I can use that palette name as a simple parameter to change the palette I'm using.

    Is there a simple way, like I've shown above or similar, to make a one-and-done selection of my desired primary color? Or do I have to create a custom preset like this:

    const AuraSky = definePreset(Aura, {
    semantic: {
    primary: {
    50: '{sky.50}',
    100: '{sky.100}',
    200: '{sky.200}',
    300: '{sky.300}',
    400: '{sky.400}',
    500: '{sky.500}',
    600: '{sky.600}',
    700: '{sky.700}',
    800: '{sky.800}',
    900: '{sky.900}',
    950: '{sky.950}'
    }
    }
    });


    That's not too terrible, I must admit, but I'd still like to know of there's an more direct way to do this.

    Continue reading...

Compartilhe esta Página