{"title":"Advanced collection","description":"","products":[{"product_id":"slate-collection","title":"Slate Collection","description":"\u003col data-spread=\"true\" start=\"1\"\u003e\n\u003cli\u003e\n\u003cstrong\u003eProblem Statement\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eAfter learners practice separate HTML and CSS topics, they often face a new challenge: combining many ideas without making the page feel crowded or inconsistent. A heading may look right in one section but feel out of place in another. Cards, buttons, spacing, and backgrounds may use different rules, which can make the full page harder to review. Learners may also repeat code too often because they are not sure how to create shared patterns. Slate Collection was created for learners who want a more structured way to gather their HTML and CSS knowledge into a cleaner page-building workflow.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003cli\u003e\n\u003cstrong\u003eSolution\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eSlate Collection offers a guided course path for organizing page elements into a cohesive layout system. The course explains how to create shared styles for typography, spacing, containers, cards, and repeated sections. Learners study how to build pages that use consistent patterns without feeling flat or mechanical. Each module connects practical HTML structure with CSS rules that can be reused across several page areas. The course helps learners develop a steadier method for building pages with thoughtful structure and visual order.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003cli\u003e\n\u003cstrong\u003eWhat’s Inside\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eSlate Collection includes a broad set of lessons, modules, examples, and practice materials focused on building organized HTML\/CSS pages from several connected parts. The course begins with an orientation module that explains how a page can be treated as a collection of reusable parts. Learners explore how headings, content blocks, cards, lists, buttons, and section wrappers can work together as a clear visual language.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003c\/ol\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe first module focuses on shared page structure. Learners study how to create a base HTML layout with a main section, supporting sections, content groups, and repeated areas. The materials explain how to keep markup readable while still giving each page area a clear role. Learners practice building section skeletons before adding detailed styling.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe second module explores typography systems. Learners work with heading sizes, paragraph spacing, line height, labels, short descriptions, and text grouping. The course explains how repeated text styles can create a more consistent page experience. Practice tasks invite learners to compare several text arrangements and adjust them for clarity.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe third module focuses on spacing rules. Learners study how to use padding, margin, section gaps, and container widths in a more organized way. The course explains how repeated spacing values can reduce visual clutter and make pages easier to adjust. Learners practice creating spacing rules that work across headers, cards, text blocks, and callout areas.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe fourth module introduces reusable card and content patterns. Learners build course cards, resource blocks, feature groups, and short information panels. Each pattern is shown through HTML first, then styled with CSS. Learners study how class names, wrappers, and repeated rules can keep code organized while still leaving room for variation.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe fifth module focuses on visual consistency. Learners explore how backgrounds, borders, shadows, spacing, and text hierarchy can be repeated in a controlled way. The materials explain how to keep a page visually connected without making every section look identical. Practice tasks ask learners to adjust section contrast, refine card spacing, and review repeated style choices.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe sixth module brings everything together through a guided multi-section page build. Learners create a course overview page with a main introduction, course collection area, feature cards, learning notes, FAQ preview, and contact prompt. The build is divided into stages: planning the layout, writing HTML, creating shared CSS rules, styling repeated sections, and reviewing the full page.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eSlate Collection also includes worksheets for style planning, class naming, spacing notes, and section review. These materials give learners a practical way to keep track of design decisions while working through the course. Learners can return to these resources when practicing with their own layouts.\u003c\/span\u003e\u003c\/p\u003e\n\u003col data-spread=\"false\" start=\"4\"\u003e\n\u003cli\u003e\n\u003cstrong\u003eWho Is This For?\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eSlate Collection is for learners who already understand basic HTML and CSS and want to organize their knowledge into a broader page-building process. It fits people who can create individual sections but want guidance on connecting several sections into one cleaner layout. It is also useful for learners who want to reduce repeated styling and develop more thoughtful code habits.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003c\/ol\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThis course may fit students, creative learners, course page builders, and anyone who wants to work with reusable HTML\/CSS patterns. It is especially suitable for learners who enjoy order, consistency, and practical page composition.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eSlate Collection is not focused on complex engineering workflows or advanced CSS architecture. It stays centered on HTML\/CSS page structure, shared styling rules, reusable blocks, and layout consistency. It is a good fit for learners who want their pages to feel more organized from the first section to the final contact area.\u003c\/span\u003e\u003c\/p\u003e\n\u003col data-spread=\"false\" start=\"5\"\u003e\n\u003cli style=\"font-weight: bold;\"\u003e\u003cstrong\u003eWhat You’ll Learn\u003c\/strong\u003e\u003c\/li\u003e\n\u003c\/ol\u003e\n\u003cul data-spread=\"false\"\u003e\n\u003cli\u003e\u003cspan\u003eHow to organize a page as a collection of reusable parts\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to build clear HTML section skeletons\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to create shared typography rules\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to group headings, labels, and short descriptions\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to use repeated spacing values across a page\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to build reusable cards and content blocks\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to style course collection areas with CSS\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to keep class names readable during practice\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to create section contrast without clutter\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to review repeated style patterns\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to connect several sections into one full layout\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to use planning sheets while building HTML\/CSS pages\u003c\/span\u003e\u003c\/li\u003e\n\u003c\/ul\u003e\n\u003col data-spread=\"false\" start=\"6\"\u003e\n\u003cli\u003e\n\u003cstrong\u003eRefund Terms\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eSlate Collection includes a 30-day refund window. Learners may request a refund within 30 days according to the store’s refund terms. This gives time to review the course materials and decide whether the learning format fits personal study needs.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003c\/ol\u003e","brand":"Hyrveliq","offers":[{"title":"Default Title","offer_id":57558773793112,"sku":null,"price":201.0,"currency_code":"EUR","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0997\/0892\/8344\/files\/slate_3.jpg?v=1782298235"},{"product_id":"vertex-layout","title":"Vertex Layout","description":"\u003col data-spread=\"true\" start=\"1\"\u003e\n\u003cli\u003e\n\u003cstrong\u003eProblem Statement\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eMany learners reach a stage where single sections feel manageable, but full page layouts still feel difficult to shape. A page may contain a strong opening area, useful content blocks, and styled cards, yet the full layout can still feel uneven when everything is placed together. Spacing may work in one section but not in another, and repeated blocks may lose visual order when the content length changes. Learners may also struggle with arranging columns, cards, and text groups in a way that stays readable across different screen widths. Vertex Layout was created for learners who want a deeper, more organized way to build complete HTML\/CSS layouts.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003cli\u003e\n\u003cstrong\u003eSolution\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eVertex Layout gives learners a structured course path for planning, building, and refining multi-section page layouts. The course explains how to connect layout structure with HTML grouping, CSS spacing, section width, alignment, and flexible content patterns. Learners study how to shape page areas that feel connected while still giving each section its own purpose. Each module includes guided examples, practice tasks, and review prompts that help learners think through layout choices with care. The course supports a more thoughtful HTML\/CSS workflow from first page outline to final styling review.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003cli\u003e\n\u003cstrong\u003eWhat’s Inside\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eVertex Layout includes a detailed set of modules and materials focused on building fuller HTML\/CSS pages with organized layouts. The course begins with an orientation module that introduces the idea of layout vertices: key points where structure, spacing, and content direction meet. Learners are guided to see a webpage as a set of connected layout decisions rather than a stack of unrelated sections.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003c\/ol\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe first module focuses on layout planning. Learners study how to outline a page before writing code, decide which sections should appear first, and map how content should move from introduction to supporting details. The materials explain how page rhythm can be planned through section order, content grouping, and visual weight. Learners practice creating layout sketches in written form, using simple notes for headings, section roles, and content blocks.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe second module explores HTML grouping for complete layouts. Learners work with main wrappers, section containers, inner groups, text blocks, card groups, and supporting areas. The course explains how to keep markup readable while still creating enough structure for styling. Learners compare loose markup with more organized section markup, then rebuild examples with cleaner grouping.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe third module focuses on CSS layout foundations. Learners study width control, spacing rules, alignment, display behavior, columns, wrapping card groups, and flexible section arrangements. The materials show how CSS can shape a layout without overcomplicating the code. Learners practice building two-column areas, centered content sections, card rows, and stacked content groups.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe fourth module introduces flexible card systems. Learners create course cards, topic cards, resource cards, and short note blocks. Each card pattern is built with HTML first, then styled with CSS. The module explains how to handle different text lengths, repeated spacing, visual grouping, and hover-style refinements without making the layout feel cluttered.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe fifth module focuses on section transitions. Learners study how one section leads into the next through spacing, background shifts, heading placement, and content rhythm. The course explains how too many visual changes can make a page feel noisy, while too little contrast can make sections blend together. Practice tasks ask learners to refine section gaps, adjust backgrounds, and review the page from top to bottom.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe sixth module introduces layout review. Learners are guided through checking section order, spacing consistency, heading hierarchy, content grouping, and repeated styling patterns. The course includes review prompts that help learners notice layout issues before they continue adding more code. This gives learners a practical habit for improving pages through careful review.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eVertex Layout also includes a full guided build. Learners create a multi-section course page with a main opening area, topic overview, structured card section, learning notes, FAQ preview, and contact area. The build is divided into planning, HTML structure, CSS layout, spacing refinement, and final review. Supporting materials include class naming notes, spacing worksheets, layout planning prompts, and reusable section examples.\u003c\/span\u003e\u003c\/p\u003e\n\u003col data-spread=\"false\" start=\"4\"\u003e\n\u003cli\u003e\n\u003cstrong\u003eWho Is This For?\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eVertex Layout is for learners who already understand HTML and CSS basics and want more practice with complete page layouts. It fits people who can build separate sections but want a clearer method for connecting those sections into one organized page. It is also useful for learners who want to improve spacing, alignment, card groups, and flexible layout patterns.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003c\/ol\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThis course may fit students, creative learners, course page builders, and anyone who wants more detailed layout practice with HTML and CSS. It is especially suitable for learners who enjoy building full pages and want each section to feel purposeful.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eVertex Layout is not focused on advanced engineering systems or heavy technical workflows. It stays centered on HTML\/CSS layout practice, section planning, visual order, flexible grouping, and page review. It is a fitting step for learners who want to move beyond small sections and spend more time shaping complete pages.\u003c\/span\u003e\u003c\/p\u003e\n\u003col data-spread=\"false\" start=\"5\"\u003e\n\u003cli style=\"font-weight: bold;\"\u003e\u003cstrong\u003eWhat You’ll Learn\u003c\/strong\u003e\u003c\/li\u003e\n\u003c\/ol\u003e\n\u003cul data-spread=\"false\"\u003e\n\u003cli\u003e\u003cspan\u003eHow to plan a full HTML\/CSS page before coding\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to arrange sections in a thoughtful order\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to group HTML elements for cleaner styling\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to create wrappers, containers, and inner groups\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to control spacing across several page sections\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to build two-column content areas\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to create flexible card groups with CSS\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to handle different content lengths inside repeated blocks\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to use background shifts and spacing for section separation\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to review a page from top to bottom\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to refine layout rhythm through small CSS changes\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to build a full course page from outline to styled layout\u003c\/span\u003e\u003c\/li\u003e\n\u003c\/ul\u003e\n\u003col data-spread=\"false\" start=\"6\"\u003e\n\u003cli\u003e\n\u003cstrong\u003eRefund Terms\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eVertex Layout includes a 30-day refund window. Learners may request a refund within 30 days according to the store’s refund terms. This gives time to review the course materials and decide whether the learning format fits personal study needs.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003c\/ol\u003e","brand":"Hyrveliq","offers":[{"title":"Default Title","offer_id":57558780477784,"sku":null,"price":216.0,"currency_code":"EUR","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0997\/0892\/8344\/files\/vertex_3.jpg?v=1782298235"},{"product_id":"loom-library","title":"Loom Library","description":"\u003col data-spread=\"true\" start=\"1\"\u003e\n\u003cli\u003e\n\u003cstrong\u003eProblem Statement\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eMany learners reach a point where they can build page sections, yet they still feel unsure when they need to organize many reusable parts together. A page may contain cards, headings, links, information blocks, and contact areas, but the structure can become difficult to review as the code grows. CSS rules may repeat too often, section styles may lose consistency, and class names may become harder to follow. Learners may also struggle to create a practical reference system for their own HTML and CSS practice. Loom Library was created for learners who want to gather reusable ideas into a more organized coding library.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003cli\u003e\n\u003cstrong\u003eSolution\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eLoom Library gives learners a structured course path for creating reusable HTML and CSS patterns. The course explains how to build section groups, card sets, content blocks, text systems, spacing notes, and styling references that can be reused during practice. Learners study how to keep code readable while building a wider range of page parts. Each module connects practical examples with review materials, so learners can return to patterns and understand how they work. The course helps learners develop a more organized way to collect, study, and rebuild HTML\/CSS layouts.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003cli\u003e\n\u003cstrong\u003eWhat’s Inside\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eLoom Library includes a detailed set of lessons, modules, reference materials, and guided exercises focused on reusable HTML and CSS building blocks. The course begins with an orientation module that explains how to think about a personal code library. Learners are shown how small patterns can be stored, studied, adjusted, and reused during future practice.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003c\/ol\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe first module focuses on HTML pattern structure. Learners work with common page parts such as main sections, intro blocks, feature groups, cards, lists, quote-style areas, resource sections, FAQ previews, and contact prompts. The materials explain how to write markup that is readable, practical, and ready for styling. Learners compare loose examples with more organized versions to understand how section structure affects the full page.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe second module focuses on CSS pattern organization. Learners study how to arrange typography rules, spacing rules, color notes, borders, backgrounds, containers, card styles, and link states. The course explains how to group related rules so that styling choices are easier to revisit. Learners practice turning scattered CSS into cleaner sections with comments and readable ordering.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe third module introduces reusable card systems. Learners build course cards, topic cards, resource cards, checklist cards, and compact information blocks. Each card type is shown with HTML structure first, then styled with CSS. Practice tasks invite learners to adjust spacing, heading size, border style, background tone, and content length while keeping the code organized.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe fourth module focuses on section libraries. Learners create a set of reusable webpage sections, including an opening section, course overview area, learning notes block, benefits-style section, FAQ teaser, and contact area. Each section is treated as a reusable pattern that can be rebuilt and adapted during practice. The course explains how to keep shared style rules consistent while still allowing sections to feel distinct.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe fifth module covers typography and spacing references. Learners create simple reference notes for heading sizes, paragraph spacing, line height, section gaps, container widths, and card padding. These references help learners make more consistent styling choices while building pages. The goal is to reduce random edits and create a clearer rhythm across the page.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe sixth module introduces pattern review. Learners study how to check whether a reusable pattern is understandable, flexible, and visually balanced. Review prompts ask learners to inspect class names, spacing values, repeated rules, section order, and content grouping. This gives learners a practical method for refining their own HTML\/CSS materials.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eLoom Library also includes a guided library-building exercise. Learners create a small personal HTML\/CSS reference set with several reusable sections and card types. The exercise moves through planning, markup, styling, reference notes, and final review. Supporting materials include naming prompts, spacing sheets, section templates, and code reading tasks.\u003c\/span\u003e\u003c\/p\u003e\n\u003col data-spread=\"false\" start=\"4\"\u003e\n\u003cli\u003e\n\u003cstrong\u003eWho Is This For?\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eLoom Library is for learners who already understand HTML and CSS basics and want to organize their practice into reusable patterns. It fits people who can build page sections but want a more thoughtful way to collect code examples, refine repeated styles, and create their own reference materials.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003c\/ol\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThis course may fit students, creative learners, course page builders, and anyone who wants a structured way to study reusable HTML\/CSS parts. It is especially useful for learners who enjoy organized notes, repeated patterns, and practical examples they can revisit during study.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eLoom Library is not focused on complex development systems or third-party tools. It stays centered on HTML\/CSS pattern building, reusable section practice, code organization, and styling references. It is a fitting step for learners who want their study materials to become more structured and easier to review.\u003c\/span\u003e\u003c\/p\u003e\n\u003col data-spread=\"false\" start=\"5\"\u003e\n\u003cli style=\"font-weight: bold;\"\u003e\u003cstrong\u003eWhat You’ll Learn\u003c\/strong\u003e\u003c\/li\u003e\n\u003c\/ol\u003e\n\u003cul data-spread=\"false\"\u003e\n\u003cli\u003e\u003cspan\u003eHow to create a personal HTML\/CSS pattern library\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to organize reusable HTML section structures\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to group CSS rules by purpose\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to build reusable course cards and topic cards\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to create compact information blocks\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to design repeated sections with clear structure\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to use class names that describe each block\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to create spacing and typography references\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to review repeated CSS rules\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to adjust reusable patterns without losing order\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to build a small reference set for future practice\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to connect reusable patterns into a page layout\u003c\/span\u003e\u003c\/li\u003e\n\u003c\/ul\u003e\n\u003col data-spread=\"false\" start=\"6\"\u003e\n\u003cli\u003e\n\u003cstrong\u003eRefund Terms\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eLoom Library includes a 30-day refund window. Learners may request a refund within 30 days according to the store’s refund terms. This gives time to review the course materials and decide whether the learning format fits their study needs.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003c\/ol\u003e","brand":"Hyrveliq","offers":[{"title":"Default Title","offer_id":57558785622360,"sku":null,"price":246.0,"currency_code":"EUR","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0997\/0892\/8344\/files\/loom_2.jpg?v=1782298235"},{"product_id":"anchor-library","title":"Anchor Library","description":"\u003col data-spread=\"true\" start=\"1\"\u003e\n\u003cli\u003e\n\u003cstrong\u003eProblem Statement\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eAs learners build larger HTML and CSS pages, it becomes harder to keep every section organized. A page may begin with clean markup, but after adding cards, text blocks, contact areas, and repeated sections, the code can become harder to follow. CSS rules may appear in different places without a clear reason, which makes later edits feel confusing. Learners may also struggle to keep page sections visually connected while still giving each area its own role. Anchor Library was created for learners who want a steadier system for arranging, reviewing, and refining HTML\/CSS page parts.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003cli\u003e\n\u003cstrong\u003eSolution\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eAnchor Library gives learners a structured course path built around dependable HTML and CSS patterns. The course explains how to create stable section foundations, reusable layout anchors, organized class names, and practical reference materials. Learners study how to connect page parts through shared spacing, typography, containers, and content blocks. Each module shows how a single section can be written, styled, reviewed, and then adapted for a larger page. The course helps learners build a calmer workflow for creating HTML\/CSS layouts with more order and less guesswork.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003cli\u003e\n\u003cstrong\u003eWhat’s Inside\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eAnchor Library includes a detailed set of lessons, modules, examples, and study materials focused on turning reusable HTML\/CSS parts into a steady page-building system. The course begins with an orientation module that introduces the idea of layout anchors. In this course, an anchor is a stable page part that helps the rest of the layout stay organized, such as a main content wrapper, section container, card group, heading block, or spacing pattern.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003c\/ol\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe first module focuses on HTML anchors. Learners study how to build dependable markup structures that can be reused across course pages, information pages, and contact sections. The materials cover main wrappers, inner containers, grouped text areas, section headings, list blocks, card rows, and simple footer structures. Each example is written to show how clean HTML can create a stronger base before styling begins.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe second module focuses on CSS anchors. Learners create shared rules for containers, section spacing, typography, card padding, background areas, and link styling. The course explains how repeated CSS patterns can reduce clutter and make a stylesheet easier to review. Learners compare scattered styling examples with organized versions, then practice rewriting rules into clearer groups.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe third module introduces anchor-based section building. Learners create several reusable sections, including an opening area, course overview block, learning path section, resource group, FAQ preview, and contact prompt. Each section is treated as a stable pattern that can be adjusted without losing its structure. The goal is to help learners understand how repeated HTML and CSS choices can guide a full page.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe fourth module explores spacing and alignment anchors. Learners study how consistent section gaps, container widths, and inner spacing values can make a page feel more balanced. The materials explain how margin, padding, width, and alignment choices affect the relationship between sections. Practice tasks invite learners to adjust spacing values and review how each change affects the whole layout.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe fifth module focuses on reference building. Learners create a small set of personal notes for recurring HTML patterns, CSS groups, class naming ideas, and layout review questions. These notes are designed to help learners return to important ideas while practicing. The course encourages learners to write references in their own words, which can make the material easier to revisit later.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe sixth module brings the course together through a guided page build. Learners create a structured HTML\/CSS page using several layout anchors. The page includes a main opening area, course collection preview, learning notes, reusable cards, FAQ area, and contact section. The build is divided into planning, markup, styling, spacing review, and final code review.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eAnchor Library also includes practice prompts after key modules. These prompts ask learners to rebuild a section, rename classes, group CSS rules, refine spacing, and compare two layout versions. Supporting materials include section templates, class naming notes, spacing worksheets, and code review prompts.\u003c\/span\u003e\u003c\/p\u003e\n\u003col data-spread=\"false\" start=\"4\"\u003e\n\u003cli\u003e\n\u003cstrong\u003eWho Is This For?\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eAnchor Library is for learners who already understand HTML and CSS basics and want a stronger method for organizing page parts. It fits people who can build individual sections but want to create a more stable structure for full-page practice. It is also useful for learners who feel their code becomes harder to review as a page grows.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003c\/ol\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThis course may fit students, creative learners, small site builders, course page builders, and anyone who wants to develop a more organized HTML\/CSS workflow. It is especially suitable for learners who enjoy structured references, reusable patterns, and steady page-building habits.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eAnchor Library is not focused on complex development systems or third-party tools. It stays centered on HTML\/CSS structure, reusable section patterns, shared styling rules, and layout review. It is a fitting step for learners who want their pages to feel clearer from the first section to the final contact area.\u003c\/span\u003e\u003c\/p\u003e\n\u003col data-spread=\"false\" start=\"5\"\u003e\n\u003cli style=\"font-weight: bold;\"\u003e\u003cstrong\u003eWhat You’ll Learn\u003c\/strong\u003e\u003c\/li\u003e\n\u003c\/ol\u003e\n\u003cul data-spread=\"false\"\u003e\n\u003cli\u003e\u003cspan\u003eHow to create stable HTML structures for repeated page sections\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to build reusable wrappers, containers, and grouped text areas\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to organize CSS into clear style groups\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to create shared spacing rules across a page\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to write class names that describe each section role\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to build reusable cards, resource blocks, and FAQ previews\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to connect several sections through consistent layout choices\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to review spacing, typography, and section order\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to create personal HTML\/CSS reference notes\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to adjust repeated patterns without breaking the page structure\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to build a full page from reusable layout anchors\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to prepare for the final Hyrveliq library tier\u003c\/span\u003e\u003c\/li\u003e\n\u003c\/ul\u003e\n\u003col data-spread=\"false\" start=\"6\"\u003e\n\u003cli\u003e\n\u003cstrong\u003eRefund Terms\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eAnchor Library includes a 30-day refund window. Learners may request a refund within 30 days according to the store’s refund terms. This gives time to review the course materials and decide whether the learning format fits personal study needs.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003c\/ol\u003e","brand":"Hyrveliq","offers":[{"title":"Default Title","offer_id":57558800073048,"sku":null,"price":297.0,"currency_code":"EUR","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0997\/0892\/8344\/files\/anchor_2.jpg?v=1782298234"},{"product_id":"neon-library","title":"Neon Library","description":"\u003col data-spread=\"true\" start=\"1\"\u003e\n\u003cli\u003e\n\u003cstrong\u003eProblem Statement\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eAt a later learning stage, many learners can build individual HTML and CSS sections, but connecting them into a polished full page can still feel challenging. A layout may contain useful parts, yet the overall page can lose rhythm when sections, cards, headings, and contact areas are placed together. CSS files can become long, repeated rules can appear in several places, and class names may stop feeling clear. Learners may also need a better way to review their own pages, identify uneven spacing, and adjust repeated patterns. Neon Library was created for learners who want a wider course path for building, organizing, and refining HTML\/CSS page systems.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003cli\u003e\n\u003cstrong\u003eSolution\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eNeon Library guides learners through a detailed HTML and CSS workflow built around reusable page libraries. The course explains how to plan a page, create structured HTML sections, write organized CSS, refine repeated layouts, and review the final result with care. Learners work with content blocks, card groups, page sections, reference notes, and full-page exercises. Each module connects a practical coding task with a clear reason behind the structure and styling choice. The course helps learners develop stronger page-building habits through detailed materials, guided examples, and thoughtful review steps.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003cli\u003e\n\u003cstrong\u003eWhat’s Inside\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eNeon Library includes a wide set of lessons, modules, reference materials, and guided exercises focused on building a complete HTML\/CSS section library. The course begins with an orientation module that explains how to treat a webpage as a connected system of reusable parts. Learners explore how headings, containers, cards, text groups, lists, section backgrounds, spacing values, and contact areas can work together across a full page.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003c\/ol\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe first module focuses on page planning. Learners create a written page outline before writing code. This outline includes the main opening section, course overview, learning notes, section groups, resource areas, FAQ preview, and contact prompt. The materials explain how each page part should have a clear role, so the layout has direction before HTML begins.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe second module focuses on structured HTML. Learners study how to build reusable section markup with wrappers, containers, inner groups, heading blocks, card rows, and supporting text areas. The course explains how to keep markup readable when a page grows longer. Practice tasks ask learners to rewrite loose page sections into cleaner, grouped structures.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe third module focuses on CSS organization. Learners create separate rule groups for base styling, typography, spacing, containers, cards, section backgrounds, links, and responsive layout behavior. The course shows how organized CSS can make review and editing less confusing. Learners practice moving scattered rules into clearer sections and comparing the difference.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe fourth module explores refined spacing. Learners study section gaps, inner padding, card spacing, heading margins, paragraph rhythm, and full-page vertical flow. The materials explain how spacing can guide attention and make page content feel easier to follow. Practice tasks invite learners to compare tight, loose, and balanced spacing versions, then describe what changed.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe fifth module introduces reusable visual sections. Learners build several HTML\/CSS patterns, including a course overview area, topic grid, learning notes section, resource cards, FAQ preview, and contact block. Each section is built from markup to styling, then reviewed for structure, spacing, and clarity. Learners are encouraged to rebuild each pattern in their own words to strengthen understanding.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe sixth module focuses on card libraries. Learners create several card types, including compact cards, detail cards, checklist cards, and course preview cards. The course explains how to manage varied text lengths, internal spacing, heading hierarchy, and repeated visual details. Learners also practice adjusting card groups so they remain organized within wider page sections.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe seventh module covers typography systems. Learners review heading levels, paragraph sizing, label text, small notes, line height, and content grouping. The materials show how text choices affect the reading flow of a page. Practice tasks ask learners to refine headings, shorten supporting descriptions, and align text styling across several sections.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThe eighth module focuses on full-page review. Learners study how to inspect a layout from top to bottom, checking section order, repeated spacing, class names, card alignment, text hierarchy, and visual consistency. The course includes review prompts that can be reused during personal practice. These prompts help learners notice issues before adding extra code.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eNeon Library also includes a guided final build. Learners create a complete HTML\/CSS course page using the section library developed throughout the course. The build moves through planning, HTML structure, CSS styling, spacing refinement, card organization, typography review, and final layout review. Supporting materials include page outline sheets, section templates, class naming notes, spacing references, CSS review prompts, and reusable code examples.\u003c\/span\u003e\u003c\/p\u003e\n\u003col data-spread=\"false\" start=\"4\"\u003e\n\u003cli\u003e\n\u003cstrong\u003eWho Is This For?\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eNeon Library is for learners who already understand HTML and CSS basics and want a fuller course path for organized page building. It fits people who can build several sections but want deeper practice with reusable layouts, CSS structure, spacing review, and page-wide consistency.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003c\/ol\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eThis course may fit students, creative learners, small site builders, course page creators, and anyone who wants a structured way to develop practical HTML\/CSS materials. It is especially useful for learners who enjoy detailed examples, reusable sections, and organized references they can revisit during study.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp class=\"isSelectedEnd\"\u003e\u003cspan\u003eNeon Library is not focused on complex engineering systems or third-party tools. It stays centered on HTML\/CSS structure, reusable section libraries, page layout, CSS organization, and review habits. It is a fitting final tier for learners who want to bring many page-building ideas into one structured learning path.\u003c\/span\u003e\u003c\/p\u003e\n\u003col data-spread=\"false\" start=\"5\"\u003e\n\u003cli style=\"font-weight: bold;\"\u003e\u003cstrong\u003eWhat You’ll Learn\u003c\/strong\u003e\u003c\/li\u003e\n\u003c\/ol\u003e\n\u003cul data-spread=\"false\"\u003e\n\u003cli\u003e\u003cspan\u003eHow to plan a full HTML\/CSS page before writing code\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to organize a page into reusable sections\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to write cleaner HTML wrappers, containers, and content groups\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to group CSS rules by role and section\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to create reusable course overview areas\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to build topic grids, note blocks, and contact sections\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to create compact cards, detail cards, and checklist cards\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to manage spacing across a longer page\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to refine heading hierarchy and paragraph rhythm\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to review class names for clarity\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to compare several layout versions during practice\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to build a complete course page from planning to final review\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to create a personal HTML\/CSS reference library\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eHow to revisit and refine page sections through guided prompts\u003c\/span\u003e\u003c\/li\u003e\n\u003c\/ul\u003e\n\u003col data-spread=\"false\" start=\"6\"\u003e\n\u003cli\u003e\n\u003cstrong\u003eRefund Terms\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eNeon Library includes a 30-day refund window. Learners may request a refund within 30 days according to the store’s refund terms. This gives time to review the course materials and decide whether the learning format fits personal study needs.\u003c\/span\u003e\n\u003c\/li\u003e\n\u003c\/ol\u003e","brand":"Hyrveliq","offers":[{"title":"Default Title","offer_id":57558805479768,"sku":null,"price":483.0,"currency_code":"EUR","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0997\/0892\/8344\/files\/neon_3.jpg?v=1782298235"}],"url":"https:\/\/hyrveliq.com\/collections\/advanced-collection.oembed","provider":"Hyrveliq","version":"1.0","type":"link"}