HP.com Design System HP.com Design System HP.com Design System
- HP.com Design System
-
Overview
-
Typography
-
Color
-
Photography
-
UI Elements
- Modular components
-
Experiential components
- Anchor navigation
- Audio player
- Back-to-top
- Basic Sticky
- Basic tabs
- Breadcrumbs
- Category hotspots
- Compare table
- Content accordian
- Countdown timer
- Custom info banner
- Faceted search
- Feature focus
- Highlighted CTA
- Horizontal content switcher
- Horizontal Scrolling
- Hotspot Content Viewer
- In-page navigation
- KSP carousel
- Large card slider
- Map component
- Model viewer
- Performance comparison
- Pop up banner
- Port viewer
- Product module
- Product magnifier
- Product view card
- Resolution module
- Scrolling ambient video
- Secondary navigation
- Small info banner
- Statistics card
- Statistics drawer
- Step-by-step
- Use case card
- Use case drawer
- Vertical content switcher
- Visual tabs
Product module
A container that holds a group of product or service tiles in a carousel or grid for easy visual and feature comparison.
Select the HP OfficeJet Pro that’s best for your business
About our products
Battery life up to 19.45hs
Supports battery fast charge: approximately 50% in 45 minutes
About our products
Battery life up to 19.45hs
Supports battery fast charge: approximately 50% in 45 minutes
Starting at $799.99
Spectre x360 laptop with short title
Exquisite craftsmanship. Impressive power.
Forest green with speckles
Forest green with specklesSpectre x360 laptop with short title
Exquisite craftsmanship. Impressive power.
Starting at $799.99
Spectre x360 laptop with short title - Light basalt
Exquisite craftsmanship. Impressive power.
Light basalt
Light basaltSpectre x360 laptop with short title - Light basalt
Exquisite craftsmanship. Impressive power.
Starting at $799.99
Spectre x360 laptop with short title - Black
Exquisite craftsmanship. Impressive power.
Midnight black with forest green speck long color
Midnight black with forest green speck long colorSpectre x360 laptop with short title - Black
Exquisite craftsmanship. Impressive power.
Starting at $799.99
Spectre x360 laptop with short title - Dark blue
Exquisite craftsmanship. Impressive power.
Dark blue
Dark blueSpectre x360 laptop with short title - Dark blue
Exquisite craftsmanship. Impressive power.
Starting at $799.99
Spectre x360 laptop with short title - Golden brown
Exquisite craftsmanship. Impressive power.
Golden brown
Golden brownSpectre x360 laptop with short title - Golden brown
Exquisite craftsmanship. Impressive power.
Windows 10 Home 64 – free upgrade to Windows 11 when available
This PC comes with Windows 10 and a free Windows 11 upgrade or may be preloaded with Windows 11. The Windows 11 upgrade will be delivered late 2021 into 2022. Timing varies by device. Certain features require specific hardware.
10th Generation Intel® Core™ i7 processor
Intel® Core™ i7-10750H (2.6 GHz base frequency, up to 5.0 GHz with Intel® Turbo Boost Technology, 12 MB L3 cache, 6 cores)
Intel® HM470
16 GB DDR4-2666 MHz RAM (onboard)
Windows 10 Home 64 – free upgrade to Windows 11 when available
15.6" diagonal, FHD (1920 x 1080), IPS, narrow bezel, anti-glare, 400 nits, 72% NTSC
Starting at $679.99
Spectre x360 laptop with long title lorem ipsum dolar sit amet consecutor
Exquisite craftsmanship. Impressive power.
Forest green with speckles
Forest green with specklesSpectre x360 laptop with long title lorem ipsum dolar sit amet consecutor
Starting at $799.99
Spectre x360 laptop with short title - Light basalt
Exquisite craftsmanship. Impressive power.
Light basalt
Light basaltSpectre x360 laptop with short title - Light basalt
Exquisite craftsmanship. Impressive power.
Starting at $799.99
Spectre x360 laptop with short title - Black
Exquisite craftsmanship. Impressive power.
Midnight black with forest green speck long color
Midnight black with forest green speck long colorSpectre x360 laptop with short title - Black
Exquisite craftsmanship. Impressive power.
Windows 10 Home 64 – free upgrade to Windows 11 when available
This PC comes with Windows 10 and a free Windows 11 upgrade or may be preloaded with Windows 11. The Windows 11 upgrade will be delivered late 2021 into 2022. Timing varies by device. Certain features require specific hardware.
10th Generation Intel® Core™ i7
Intel® Core™ i7-10750H (2.6 GHz base frequency, up to 5.0 GHz with Intel® Turbo Boost Technology, 12 MB L3 cache, 6 cores)
Intel® HM470
16 GB DDR4-2666 MHz RAM
Windows 10 Home 64 – free upgrade to Windows 11 when available
15" diagonal, FHD (1920 x 1080), IPS, narrow bezel, anti-glare, 400 nits, 72% NTSC
Starting at $799.99
OMEN X 2S
Exquisite craftsmanship. Impressive power.
Forest green with speckles
Forest green with specklesOMEN X 2S
There can never be too much of a good thing. With up to an 10th Gen Intel® Core™ i7 processor4 and up to NVIDIA® GeForce RTX™ 30705, it makes you wonder how it all fits into such a tiny little package.
Starting at $799.99
Spectre x360 laptop with short title - Light basalt
Exquisite craftsmanship. Impressive power.
Light basalt
Light basaltSpectre x360 laptop with short title - Light basalt
Exquisite craftsmanship. Impressive power.
Starting at $799.99
Spectre x360 laptop with short title - Black
Exquisite craftsmanship. Impressive power.
Midnight black with forest green speck long color
Midnight black with forest green speck long colorSpectre x360 laptop with short title - Black
Exquisite craftsmanship. Impressive power.
Windows 10 Home 64 – free upgrade to Windows 11 when available
This PC comes with Windows 10 and a free Windows 11 upgrade or may be preloaded with Windows 11. The Windows 11 upgrade will be delivered late 2021 into 2022. Timing varies by device. Certain features require specific hardware.
10th Generation Intel® Core™ i7 processor
Intel® Core™ i7-10750H (2.6 GHz base frequency, up to 5.0 GHz with Intel® Turbo Boost Technology, 12 MB L3 cache, 6 cores)
Intel® HM470
16 GB DDR4-2666 MHz RAM (onboard)
Windows 10 Home 64 – free upgrade to Windows 11 when available
15.6" diagonal, FHD (1920 x 1080), IPS, narrow bezel, anti-glare, 400 nits, 72% NTSC
Spectre x360 laptop with long title lorem ipsum dolar sit amet consecutor
Exquisite craftsmanship. Impressive power.
Forest green with speckles
Forest green with specklesSpectre x360 laptop with long title lorem ipsum dolar sit amet consecutor
Starting at $799.99
Spectre x360 laptop with short title - Light basalt
Exquisite craftsmanship. Impressive power.
Light basalt
Light basaltSpectre x360 laptop with short title - Light basalt
Exquisite craftsmanship. Impressive power.
Starting at $799.99
Spectre x360 laptop with short title - Black
Exquisite craftsmanship. Impressive power.
Midnight black with forest green speck long color
Midnight black with forest green speck long colorSpectre x360 laptop with short title - Black
Exquisite craftsmanship. Impressive power.
Windows 10 Home 64 – free upgrade to Windows 11
This PC comes with Windows 10 and a free Windows 11 upgrade or may be preloaded with Windows 11. The Windows 11 upgrade will be delivered late 2021 into 2022. Timing varies by device.
10th Generation Intel® Core™ i7 processor
Intel® Core™ i7-10750H (2.6 GHz base frequency, up to 5.0 GHz with Intel® Turbo Boost Technology, 12 MB L3 cache, 6 cores)
Intel® HM470 test
16 GB DDR4-2666 MHz RAM (onboard)
Windows 10 Home 64 – free upgrade to Windows 11
15.6" diagonal, FHD (1920 x 1080), IPS, narrow bezel, anti-glare, 400 nits, 72% NTSC
Starting at $679.99
Spectre x360 laptop with long title lorem ipsum dolar sit amet consecutor
Exquisite craftsmanship. Impressive power.
Forest green with speckles
Forest green with specklesSpectre x360 laptop with long title lorem ipsum dolar sit amet consecutor
Starting at $799.99
Spectre x360 laptop with short title - Light basalt
Exquisite craftsmanship. Impressive power.
Light basalt
Light basaltSpectre x360 laptop with short title - Light basalt
Exquisite craftsmanship. Impressive power.
Starting at $799.99
Spectre x360 laptop with short title - Black
Exquisite craftsmanship. Impressive power.
Midnight black with forest green speck long color
Midnight black with forest green speck long colorSpectre x360 laptop with short title - Black
Exquisite craftsmanship. Impressive power.
Windows 10 Home 64 – free upgrade to Windows 11 when available test
This PC comes with Windows 10 and a free Windows 11 upgrade or may be preloaded with Windows 11. The Windows 11 upgrade will be delivered late 2021 into 2022. Timing varies by device. Certain features require specific hardware.
10th Generation Intel® Core™ i7 processor
Intel® Core™ i7-10750H (2.6 GHz base frequency, up to 5.0 GHz with Intel® Turbo Boost Technology, 12 MB L3 cache, 6 cores) test
Intel® HM470 test
16 GB DDR4-2666 MHz RAM (onboard)
Windows 10 Home 64 – free upgrade to Windows 11 when available test
15" diagonal, FHD (1920 x 1080), IPS, narrow bezel, anti-glare, 400 nits, 72% NTSC
Starting at $799.99
Spectre x360 laptop with short title
Exquisite craftsmanship. Impressive power.
Forest green with speckles
Forest green with specklesSpectre x360 laptop with short title
Exquisite craftsmanship. Impressive power.
Starting at $799.99
Spectre x360 laptop with short title - Light basalt
Exquisite craftsmanship. Impressive power.
Light basalt
Light basaltSpectre x360 laptop with short title - Light basalt
Exquisite craftsmanship. Impressive power.
Starting at $799.99
Spectre x360 laptop with short title - Black
Exquisite craftsmanship. Impressive power.
Midnight black with forest green speck long color
Midnight black with forest green speck long colorSpectre x360 laptop with short title - Black
Exquisite craftsmanship. Impressive power.
Starting at $799.99
Spectre x360 laptop with short title - Dark blue
Exquisite craftsmanship. Impressive power.
Dark blue
Dark blueSpectre x360 laptop with short title - Dark blue
Exquisite craftsmanship. Impressive power.
Starting at $799.99
Spectre x360 laptop with short title - Golden brown
Exquisite craftsmanship. Impressive power.
Golden brown
Golden brownSpectre x360 laptop with short title - Golden brown
Exquisite craftsmanship. Impressive power.
Windows 10 Home 64
This PC comes with Windows 10 and a free Windows 11 upgrade or may be preloaded with Windows 11.
10th Generation Intel® Core™ i7 processor test
Intel® Core™ i7-10750H (2.6 GHz base frequency, up to 5.0 GHz with Intel® Turbo Boost Technology, 12 MB L3 cache, 6 cores)
Intel® HM470
16 GB DDR4-2666 MHz RAM (onboard) test
Windows 10 Home 64 – free upgrade to Windows 11 when available
15.6" diagonal, FHD (1920 x 1080), IPS, narrow bezel, anti-glare, 400 nits, 72% NTSC
Starting at $799.99
OMEN X 2S
Exquisite craftsmanship. Impressive power.
Forest green with speckles
Forest green with specklesOMEN X 2S
There can never be too much of a good thing. With up to an 10th Gen Intel® Core™ i7 processor4 and up to NVIDIA® GeForce RTX™ 30705, it makes you wonder how it all fits into such a tiny little package.
Starting at $799.99
Spectre x360 laptop with short title - Light basalt
Exquisite craftsmanship. Impressive power.
Light basalt
Light basaltSpectre x360 laptop with short title - Light basalt
Exquisite craftsmanship. Impressive power.
Starting at $799.99
Spectre x360 laptop with short title - Black
Exquisite craftsmanship. Impressive power.
Midnight black with forest green speck long color
Midnight black with forest green speck long colorSpectre x360 laptop with short title - Black
Exquisite craftsmanship. Impressive power.
Windows 10 Home 64 – free upgrade to Windows 11 when available
This PC comes with Windows 10 and a free Windows 11 upgrade or may be preloaded with Windows 11. The Windows 11 upgrade will be delivered late 2021 into 2022. Timing varies by device. Certain features require specific hardware.
10th Generation Intel® Core™ i7 processor
Intel® Core™ i7-10750H (2.6 GHz base frequency, up to 5.0 GHz with Intel® Turbo Boost Technology, 12 MB L3 cache, 6 cores)
Intel® HM470
16 GB DDR4-2666 MHz RAM (onboard)
Windows 10 Home 64 – free upgrade to Windows 11 when available
16" diagonal, FHD (1920 x 1080), IPS, narrow bezel, anti-glare, 400 nits, 72% NTSC
Spectre x360 laptop with long title lorem ipsum dolar sit amet consecutor
Exquisite craftsmanship. Impressive power.
Forest green with speckles
Forest green with specklesSpectre x360 laptop with long title lorem ipsum dolar sit amet consecutor
Starting at $799.99
Spectre x360 laptop with short title - Light basalt
Exquisite craftsmanship. Impressive power.
Light basalt
Light basaltSpectre x360 laptop with short title - Light basalt
Exquisite craftsmanship. Impressive power.
Starting at $799.99
Spectre x360 laptop with short title - Black
Exquisite craftsmanship. Impressive power.
Midnight black with forest green speck long color
Midnight black with forest green speck long colorSpectre x360 laptop with short title - Black
Exquisite craftsmanship. Impressive power.
Windows 10 Home 64 – free upgrade to Windows 11 when available
This PC comes with Windows 10 and a free Windows 11 upgrade or may be preloaded with Windows 11. The Windows 11 upgrade will be delivered late 2021 into 2022. Timing varies by device. Certain features require specific hardware.
10th Generation Intel® Core™ i7 processor
Intel® Core™ i7-10750H (2.6 GHz base frequency, up to 5.0 GHz with Intel® Turbo Boost Technology, 12 MB L3 cache, 6 cores)
Intel® HM470 test1
16 GB DDR4-2666 MHz RAM
Windows 10 Home 64 – free upgrade to Windows 11 when available
15.6" diagonal, FHD (1920 x 1080), IPS, narrow bezel, anti-glare, 400 nits, 72% NTSC
Usage
Use this module to compare at least two products in a tile view. The length and type of information provided should be consistent across the entire product module, and should provide a concise and helpful description of each product for user exploration.
Module specifications
- Card image background color is set to grey to comply with brand guidelines for all product-related content
- Compare tool optional
- CTAs optional (up to three)
- Color swatches optional
- Feature card optional (always the first card in the row, can add more than one)
- Flags and pricing optional
- Color differentiator block (behind bullets) optional
- 'Show more' feature optional
- Ability to change product name and image with color picker
Character counts (with spaces)
- Promotion Label - 40 max characters (longer labels will be truncated with ellipses...)
- Image title - there is no set limit but a max of 66 characters is recommended
- Differentiator statement - there is no set limit but a max of 80 characters is recommended
- Bullet text - there is no set limit but a max of 50 characters is recommended
Example layouts
Desktop carousel layout (without compare tool)
Desktop grid layout (with compare option on product checked)
Desktop compare tool opened to compare three products
Tablet carousel layout
Tablet compare overlay
Tablet grid layout
Mobile carousel layout (no compare feature shown)
Mobile grid layout (no compare feature shown)
Mobile view with compare feature checked
Mobile view with compare overlay activated
Resources
Components can only be copied from our library, unless you belong to our HP Enterprise Figma instance.
Select Your Country/Region and Language
Close Country/Region Selector Dialog- Africa
- Afrique
- België
- Belgique
- Česká republika
- Danmark
- Deutschland
- Eesti
- España
- France
- Hrvatska
- Ireland
- Italia
- Latvija
- Lietuva
- Magyarország
- Middle East
- Nederland
- Nigeria
- Norge
- Österreich
- Polska
- Portugal
- România
- Saudi Arabia
- Slovenija
- Slovensko
- South Africa
- Suisse
- Suomi
- Sverige
- Switzerland
- Türkiye
- United Kingdom
- Ελλάδα
- България
- Казахстан
- Србија
- Україна
- ישראל
- الشرق الأوسط
- المملكة العربية السعودية
HP Worldwide
Select Your Country/Region and Language
- Africa
- Afrique
- América Central
- Argentina
- Asia Pacific
- Australia
- Bangladesh
- België
- Belgique
- Bolivia
- Brasil
- Canada
- Canada - Français
- Caribbean
- Česká republika
- Chile
- Colombia
- Danmark
- Deutschland
- Ecuador
- Eesti
- España
- France
- Hong Kong SAR
- Hrvatska
- India
- Indonesia
- Ireland
- Italia
- Latvija
- Lietuva
- Magyarország
- Malaysia
- México
- Middle East
- Nederland
- New Zealand
- Nigeria
- Norge
- Österreich
- Pakistan
- Paraguay
- Perú
- Philippines
- Polska
- Portugal
- Puerto Rico
- România
- Saudi Arabia
- Singapore
- Slovenija
- Slovensko
- South Africa
- Sri Lanka
- Suisse
- Suomi
- Sverige
- Switzerland
- Türkiye
- United Kingdom
- United States
- Uruguay
- Venezuela
- Việt Nam
- Ελλάδα
- България
- Казахстан
- Србија
- Україна
- ישראל
- الشرق الأوسط
- المملكة العربية السعودية
- ไทย
- 中华人民共和国
- 臺灣 地區
- 日本
- 香港特別行政區
- 한국
- Recalls|
- Product recycling|
- Accessibility|
- CA Supply Chains Act|
- Privacy|
- Use of cookies|
- Your privacy choices|
- Terms of use|
- Limited warranty statement|
- Terms & conditions of sales & service|
©2024 HP Development Company, L.P. The information contained herein is subject to change without notice.