Framework

Global Presets UI Style Guide

 

PNG Logo. Original gif was 400 x 166

Piwapan Women's Centre logo

PNG Favicon cropped from logo

Transparent background (for sidebar)

00. Section/Row/Column Spacing

Set all section, row and column spacing to 0px for all widths.

Row width 80% desktop/tablet, 90% phone

01. Color palette

FINAL: Colors from HR Logo #1

#889600

#377ec2

#fff100

#718e4e

Colors grabbed from logo

#668cb4

#fceb50

#718e4e

#cf7a46

#465a75

#c89d43

#ceddf0

#aa9e69

Colors from existing site

#FF7E28

#f6b750

#7dbee6

#feed7a

02. Alt Text style

‘Falling Sky Bold’,Helvetica,Arial,Lucida,sans-serif

Heading 1

Heading 2

Heading 3

Heading 4

text: Lorum ipsum dolor sit amet.

  • List item

Link

H1 Falling Sky Bold (TT) 36px LH 1em LS 0.3px #377ec2
“Falling Sky Bold”, Helvetica, Arial, Lucida, sans-serif

H2 Falling Sky Bold (TT) 28px 1em LS 0.3px #718e4e

H3 Falling Sky Bold 22px 1em LS 0.3px #465a75

H4 Falling Sky Bold 20px 1em LS 0.3px #718e4e

Body/list: Falling Sky Light 17px 1.7em #555
“Falling Sky Light”, Helvetica, Arial, Lucida, sans-serif

Links: #718e4e Falling Sky Bold

    03. Modules

    Primary

    Secondary

    Tertiary

    Blurb

    Your Title Goes Here

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Your Title Goes Here

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Your Title Goes Here

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Email optin

    Contact form

    2 + 9 =

    8 + 5 =

    5 + 4 =

    Image

    Call to action

    Your Title Goes Here

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Your Title Goes Here

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Your Title Goes Here

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Divider

    Person

    Name Goes Here

    Name Goes Here

    Position

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Name Goes Here

    Name Goes Here

    Position

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Name Goes Here

    Name Goes Here

    Position

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Social Media Follow

    Toggle

    Your Title Goes Here

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Your Title Goes Here

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Your Title Goes Here

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Testimonial

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Name Goes Here

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Name Goes Here

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Name Goes Here

    Video

    Accordion

    Your Title Goes Here

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Your Title Goes Here

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Your Title Goes Here

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Your Title Goes Here

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Your Title Goes Here

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Your Title Goes Here

    Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

    Blog

    Finance Assistant

    Finance Assistant

       New Employment Opportunity - Finance Assistant Join our team and enjoy a comprehensive benefits package, supportive supervisors and co-workers, on the job training, flexible work hours, work-life balance, mental health days, and 6 EXTRA stat days a year. ...

    Virtual Fashion Show

    Virtual Fashion Show

        In Honour of MMIWG and Sister's In Spirit: Piwapan Women's Centre presents a Virtual Fashion Show.  Win $200.00 OR a Professional Photo Shoot.  There are different categories for each day of the week during October 4th to October 8th.  Please submit your...

    Finance Assistant

    Finance Assistant

       New Employment Opportunity - Finance Assistant Join our team and enjoy a comprehensive benefits package, supportive supervisors and co-workers, on the job training, flexible work hours, work-life balance, mental health days, and 6 EXTRA stat days a year. ...

    Virtual Fashion Show

    Virtual Fashion Show

        In Honour of MMIWG and Sister's In Spirit: Piwapan Women's Centre presents a Virtual Fashion Show.  Win $200.00 OR a Professional Photo Shoot.  There are different categories for each day of the week during October 4th to October 8th.  Please submit your...

    Finance Assistant

    Finance Assistant

       New Employment Opportunity - Finance Assistant Join our team and enjoy a comprehensive benefits package, supportive supervisors and co-workers, on the job training, flexible work hours, work-life balance, mental health days, and 6 EXTRA stat days a year. ...

    Virtual Fashion Show

    Virtual Fashion Show

        In Honour of MMIWG and Sister's In Spirit: Piwapan Women's Centre presents a Virtual Fashion Show.  Win $200.00 OR a Professional Photo Shoot.  There are different categories for each day of the week during October 4th to October 8th.  Please submit your...