Colour Palette

The blue shades differ from the standard tailwind blue, a new colour can be defined or the default blue scale could be overwritten
The zinc shade matches tailwind default
Some additional colours have been added from the IDEX brand
Blue
50
#E9F5FF
100
#CFEAFF
200
#9CD3FF
300
#69BCFF
400
#36A6FF
500
#038FFF
600
#0073CF
700
#0059A1
800
#004073
900
#002645
950
#001A2E
Zinc
50
#fafafa
100
#f4f4f5
200
#e4e4e7
300
#d4d4d8
400
#a1a1aa
500
#71717a
600
#52525b
700
#3f3f46
800
#27272a
900
#18181b
950
#09090b
IDEX
black
#000000
dark-blue
#1E2D56
light-blue
#2B93D1
orange
#ED6539
gray
#9CA2AB
light-gray
#DDDFE2
white
#ffffff

Fonts

Two font families are used Manrope and Industry
Font
Weights
Primary Typeface
Default font used for both headings and body text
Manrope
Regular
400
SemiBold
600
Secondary Typeface
Additional font used for display headings and small details
Industry
Book
400
Bold
700

Typography

Default tailwind classes have been used to create the type scale
Important: The default tracking-tight will need to be modified from letter-spacing: -0.025em to letter-spacing: -0.02em
Base
Desktop Modifier
Display 1
font-industry text-4xl tracking-tight font-bold md:text-6xl
font-size:
60
px
|
line-height:
60
px

Heading 1

text-4xl tracking-tight font-semibold md:text-5xl
font-size:
48
px
|
line-height:
48
px

Heading 2

text-2xl tracking-tight font-semibold md:text-4xl
font-size:
36
px
|
line-height:
40
px

Heading 3

font-semibold text-2xl
font-size:
24
px
|
line-height:
32
px

Heading 4

font-semibold text-lg
font-size:
18
px
|
line-height:
28
px
Heading 5
font-semibold text-base
font-size:
16
px
|
line-height:
24
px
Heading 6
font-semibold md:text-xs leading-6
font-size:
16
px
|
line-height:
24
px
Body regular ... Vivamus sit amet sagittis ipsum. Nam pharetra vel lacus ut elementum. Donec feugiat arcu gravida, consectetur turpis sit amet, molestie nibh.
text-base
font-size:
16
px
|
line-height:
24
px
Body bold ... Vivamus sit amet sagittis ipsum. Nam pharetra vel lacus ut elementum. Donec feugiat arcu gravida, consectetur turpis sit amet, molestie nibh.
font-semibold text-base
font-size:
16
px
|
line-height:
24
px
Link regular
text-base text-blue-600 underline
font-size:
16
px
|
line-height:
24
px
Body small regular ... Vivamus sit amet sagittis ipsum. Nam pharetra vel lacus ut elementum. Donec feugiat arcu gravida, consectetur turpis sit amet, molestie nibh. Mauris vel lacus nec velit sollicitudin tincidunt eget in elit.
text-sm
font-size:
14
px
|
line-height:
20
px
Body small bold ... Vivamus sit amet sagittis ipsum. Nam pharetra vel lacus ut elementum. Donec feugiat arcu gravida, consectetur turpis sit amet, molestie nibh. Mauris vel lacus nec velit sollicitudin tincidunt eget in elit.
font-semibold text-sm
font-size:
14
px
|
line-height:
20
px
Link small regular
text-sm text-blue-600 underline
font-size:
14
px
|
line-height:
20
px
Tech regular ... Vivamus sit amet sagittis ipsum. Nam pharetra vel lacus ut elementum. Donec feugiat arcu gravida, consectetur turpis sit amet, molestie nibh.
font-industry text-base
font-size:
16
px
|
line-height:
24
px
Tech bold ... Vivamus sit amet sagittis ipsum. Nam pharetra vel lacus ut elementum. Donec feugiat arcu gravida, consectetur turpis sit amet, molestie nibh.
font-industry font-semibold text-base
font-size:
16
px
|
line-height:
24
px
Tech link
font-industry text-base text-blue-600 underline
font-size:
16
px
|
line-height:
24
px
Tech small regular ... Vivamus sit amet sagittis ipsum. Nam pharetra vel lacus ut elementum. Donec feugiat arcu gravida, consectetur turpis sit amet, molestie nibh.
font-industry text-sm
font-size:
14
px
|
line-height:
20
px
Tech small bold ... Vivamus sit amet sagittis ipsum. Nam pharetra vel lacus ut elementum. Donec feugiat arcu gravida, consectetur turpis sit amet, molestie nibh.
font-industry font-semibold text-sm
font-size:
14
px
|
line-height:
20
px
Tech small regular Uppercase
font-industry text-xs leading-5 uppercase
font-size:
12
px
|
line-height:
20
px
Tech small link
font-industry text-sm text-blue-600 underline
font-size:
14
px
|
line-height:
20
px

Icons

Refrence Link - Hyvä SVG icons Docs
eq: Using SVG icons in CMS content
{{icon "heroicons/outline/arrow-down" classes="text-blue-300" width=20 height=20}}
arrow-down-to-line arrow-down-to-line
arrow-down-wide arrow-down-wide
arrow-down arrow-down
arrow-left arrow-left
arrow-right arrow-right
arrow-up-right-from-square arrow-up-right-from-square
bars bars
calendar calendar
cart cart
check check
chevron-down chevron-down
compare compare
cube cube
double-dash double-dash
envelope envelope
face-frown-open face-frown-open
face-frown face-frown
face-laugh face-laugh
face-meh face-meh
face-smile face-smile
facebook facebook
file-pdf file-pdf
file-sharp file-sharp
file-video file-video
grid-2 grid-2
heart heart
instagram instagram
linkedin linkedin
list list
magnifying magnifying
message message
minus minus
paper-clip paper-clip
pen pen
phone phone
play play
plus plus
print print
question question
repeat repeat
rotate rotate
sliders sliders
sterling sterling
table table
delete delete
truck truck
xmark xmark
youtube youtube

Form Elements

Shipping Address
class: form-input
class: form-input
class: form-textarea
class: form-select

Product Grid

NEW PRODUCT

Buttons

class: btn-primary
class: btn btn-primary
class: btn-primary btn-icon
class: btn
class: btn
class: btn-icon
class: btn-secondary
class: btn btn-secondary
class: btn-secondary btn-icon
class: btn-secondary btn-light
class: btn-secondary btn-light
class: btn-secondary btn-light btn-icon
class: btn-secondary btn-size-lg
class: btn-primary btn-light btn-size-lg
class: btn-secondary btn-light btn-icon btn-size-lg

Tab

Tab Heading

The 500 gpm portable monitor shall meet NFPA 1964, 2018 and EN-15767-1. The quick attack monitor shall be lightweight and compact in size. It shall have a 2 1/2" inlet with a full time swivel and a 2 1/2" outlet. The monitor should weigh no more than 15 pounds or 6.8 kg less the nozzle, and have dimensional layout of 9.6"H x 15.0"L x 23.5W (deployed). The monitor shall have a maximum operating pressure of 230 psi or 16 bar. The legs shall fold away to reduce the width down to 7.75".

Tab Heading

The 500 gpm portable monitor shall meet NFPA 1964, 2018 and EN-15767-1. The quick attack monitor shall be lightweight and compact in size. It shall have a 2 1/2" inlet with a full time swivel and a 2 1/2" outlet. The monitor should weigh no more than 15 pounds or 6.8 kg less the nozzle, and have dimensional layout of 9.6"H x 15.0"L x 23.5W (deployed). The monitor shall have a maximum operating pressure of 230 psi or 16 bar. The legs shall fold away to reduce the width down to 7.75". The monitor shall have + 10° of rotation and 50° to 30° elevation range for unmanned use. The handle shall consist of a spring-loaded mechanism that lets the user travel down to 10° of elevation for manned use. The legs shall have a T design and have carbide tip spikes. The monitor shall have a safety strap with integrated bag and hook that is mounted to the monitor and can be hooked to itself to be used as a carrying strap. The monitor mounting bracket shall have the ability hold the monitor with an Akron Brass adjustable/selectable nozzle, Akron Brass fixed orifice nozzle, Akron Brass oscillating nozzle or Akron Brass smooth bore deluge tip. The monitor shall have an unobstructed waterway with a friction loss no more than 6psi at full flow. It shall have a ball shut-off valve with the Akron Tork–Lok mechanism. The material shall be of Pyrolite® construction with the Akro-Tec coating and chrome trim. The outlet shall have a reflective band for night visibility.

Tab Heading

The 500 gpm portable monitor shall meet NFPA 1964, 2018 and EN-15767-1. The quick attack monitor shall be lightweight and compact in size. It shall have a 2 1/2" inlet with a full time swivel and a 2 1/2" outlet. The monitor should weigh no more than 15 pounds or 6.8 kg less the nozzle, and have dimensional layout of 9.6"H x 15.0"L x 23.5W (deployed). The monitor shall have a maximum operating pressure of 230 psi or 16 bar. The legs shall fold away to reduce the width down to 7.75". The monitor shall have + 10° of rotation and 50° to 30° elevation range for unmanned use. The handle shall consist of a spring-loaded mechanism that lets the user travel down to 10° of elevation for manned use. The legs shall have a T design and have carbide tip spikes. The monitor shall have a safety strap with integrated bag and hook that is mounted to the monitor and can be hooked to itself to be used as a carrying strap. The monitor mounting bracket shall have the ability hold the monitor with an Akron Brass adjustable/selectable nozzle, Akron Brass fixed orifice nozzle, Akron Brass oscillating nozzle or Akron Brass smooth bore deluge tip. The monitor shall have an unobstructed waterway with a friction loss no more than 6psi at full flow.

Tab Heading

The 500 gpm portable monitor shall meet NFPA 1964, 2018 and EN-15767-1. The quick attack monitor shall be lightweight and compact in size. It shall have a 2 1/2" inlet with a full time swivel and a 2 1/2" outlet. The monitor should weigh no more than 15 pounds or 6.8 kg less the nozzle, and have dimensional layout of 9.6"H x 15.0"L x 23.5W (deployed). The monitor shall have a maximum operating pressure of 230 psi or 16 bar. The legs shall fold away to reduce the width down to 7.75". The monitor shall have + 10° of rotation and 50° to 30° elevation range for unmanned use. The handle shall consist of a spring-loaded mechanism that lets the user travel down to 10° of elevation for manned use. The legs shall have a T design and have carbide tip spikes. The monitor shall have a safety strap with integrated bag and hook that is mounted to the monitor and can be hooked to itself to be used as a carrying strap. The monitor mounting bracket shall have the ability hold the monitor with an Akron Brass adjustable/selectable nozzle, Akron Brass fixed orifice nozzle, Akron Brass oscillating nozzle or Akron Brass smooth bore deluge tip. The monitor shall have an unobstructed waterway with a friction loss no more than 6psi at full flow. It shall have a ball shut-off valve with the Akron Tork–Lok mechanism. The material shall be of Pyrolite® construction with the Akro-Tec coating and chrome trim. The outlet shall have a reflective band for night visibility.

loader
Loading...