Using Markdown

This demonstration page collects a dense set of markdown formatting examples so writers can scan common patterns, review syntax in context, and adapt the snippets when drafting their own Canopy IIIF content.

Basic Emphasis and Structure

Paragraphs can mix italics, bold, and bold italics alongside inline code to highlight commands or filenames. Use strikethrough sparingly when documenting deprecated options, and remember that links to references can sit inline with other text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Integer tincidunt efficitur eros, in porta mauris vel sapien sagittis, auctor feugiat orci malesuada. Vestibulum rhoncus libero eget urna bibendum, a accumsan nisl porttitor. Nulla facilisi, phasellus posuere pulvinar ligula, fermentum elementum velit.

Nested Elements

  1. Ordered lists keep steps clear:
    1. Gather materials with curae facilisis lorem.
    2. Mix instructions and annotate with semicolons.
    3. Confirm results feel coherent.
  2. The second big step encourages variation with gravida ipsum.
  3. Final checks celebrate the finished section while referencing footnotes1.
  • Unordered lists highlight key takeaways:
    • Combine typography tricks.
    • Sprinkle latin filler where helpful.
    • Repeat motifs to boost rhythm.
  • Mixing ordered and unordered structures demonstrates interplay.

Blockquotes introduce context or testimonials. "Praesent feugiat molestie risus, sed tempor nibh pulvinar at," according to a helpful reviewer, who praised the structured approach to formatting.

Images and Captions

Soft gradient abstract art

Stacked archival boxes

The preceding pair of image embeds illustrate that multiple figures may appear in one section, each with descriptive alt text to maintain accessibility. Fusce eget tortor tellus, et imperdiet tortor. Aenean sed lorem egestas, elementum risus sed, interdum lacus.

Tables and Definition Lists

FeatureSyntaxNotes
Tables| col |Align columns with header separators.
Footnotes[^1]Place the reference, then define it later.
Images![alt](url)Provide helpful descriptions.
Code```lang ```Choose a language hint for clarity.

Term : Definition lists offer another way to link concepts with details, lorem ipsum dolor sit amet consectetur adipiscing elit.

Another Term : Add additional explanation to keep momentum, maecenas id posuere orci varius natoque penatibus magnis parturient.

Code Blocks

## Sample Code Block Add a code blocks with triple backticks, specify a language for syntax highlightingand include optional filename and copy attributes for enhanced display.

Task Lists & Callouts

  • Capture checklists that double as project trackers.
  • Keep at least one open item for future edits.
  • Demonstrate GitHub flavored markdown compatibility.

Note: Donec fermentum libero et laoreet dictum. Integer hendrerit efficitur nisl, sed convallis sem.

Extended Content Blocks

Section Alpha

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus scelerisque, mi sed lacinia posuere, nulla augue aliquet arcu, nec pharetra augue nisi non erat. Nunc a augue ultricies risus tempor volutpat. Mauris non metus ac neque interdum porta, curabitur laoreet. Integer posuere interdum sem, ac porttitor arcu pellentesque id. Duis elementum dui vitae magna fermentum, non euismod tellus ullamcorper. Sed vehicula libero vel sapien tempor sodales. Maecenas in lectus ac felis hendrerit congue non nec lectus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Integer blandit mauris id ligula porttitor, eget rutrum magna convallis. Phasellus facilisis elit sed felis aliquet convallis. Donec sit amet luctus odio, eget dignissim justo. Ut consequat ipsum sed arcu commodo finibus a nec libero. Duis at ligula porttitor, dapibus ex sit amet, ullamcorper neque.

Proin venenatis fermentum vulputate. Sed tristique elit libero, sed efficitur quam aliquam id. Sed risus magna, aliquam id ex ac, gravida luctus mi. Vestibulum viverra aliquam mi eget tincidunt. Pellentesque eu egestas risus. Nam facilisis viverra nibh, id gravida augue malesuada ac. Ut sagittis pretium leo, eget sollicitudin arcu facilisis in. Pellentesque vel imperdiet dui. Integer ut lorem et justo rhoncus faucibus consectetur ut velit. Sed sed condimentum sem. Etiam tempor sagittis odio quis tincidunt. Nam nec volutpat ex. Fusce aliquam vestibulum mauris, ac lobortis tellus facilisis non. Mauris facilisis tincidunt neque, eget fermentum sapien fringilla sed. Pellentesque sollicitudin, enim ac elementum luctus, lacus nisi lacinia erat, vitae dapibus nisi diam vitae est.

Section Beta

Curabitur lobortis risus velit, quis sagittis sem dignissim non. Phasellus feugiat massa et lacus facilisis viverra. Donec metus quam, lacinia sed gravida eget, ullamcorper nec dui. Vivamus faucibus tortor sit amet libero venenatis accumsan. Vivamus mattis, nisl quis laoreet bibendum, velit ligula laoreet magna, ac interdum dui turpis a arcu. Aenean diam velit, convallis nec gravida sed, maximus ultrices erat. Integer scelerisque orci metus, condimentum ultricies ligula varius vel. Pellentesque semper eros sit amet hendrerit imperdiet. Proin porttitor bibendum augue vitae imperdiet. Nam vulputate nisi maximus facilisis porttitor. Suspendisse imperdiet mauris vitae metus ornare tristique. Integer posuere aliquam lorem non ultrices. Vestibulum facilisis sodales commodo. Duis vestibulum mauris nec sem suscipit tincidunt. Suspendisse porttitor orci pellentesque augue commodo tempus.

Aliquam et lectus lacinia, vestibulum lectus sed, dignissim ipsum. Nullam tincidunt feugiat dapibus. Duis pharetra nisl justo, id hendrerit odio pretium id. Donec dignissim vulputate arcu vitae cursus. Cras pretium fringilla risus, eget viverra quam suscipit a. In eu scelerisque arcu. Sed viverra, risus vitae aliquet gravida, risus lectus tincidunt justo, quis aliquet lectus augue ut odio. Aenean elementum diam urna. Ut sed gravida velit. Suspendisse lacus eros, vulputate at risus nec, laoreet sollicitudin leo. Vivamus scelerisque dignissim volutpat. Nullam bibendum ante ante, ac faucibus justo interdum vitae. Sed vitae dictum ligula, nec faucibus augue. Vivamus quis ante diam.2

Section Gamma

Ut cursus erat eget pulvinar dapibus. Integer lacinia tempor cursus. Aenean dapibus mollis ligula, ac congue mi luctus sit amet. Phasellus pulvinar purus vel tortor sollicitudin rhoncus. Curabitur fringilla metus lacus, nec interdum tortor finibus nec. Vestibulum aliquam et mauris vel ultricies. Integer dictum leo non molestie laoreet. Integer ut tortor vitae est aliquet porta ut ut massa. Mauris malesuada luctus leo commodo laoreet. Pellentesque a augue et urna varius pulvinar id quis lorem. Nam sed sollicitudin nibh. Integer nisi metus, pharetra ac leo volutpat, volutpat pharetra arcu. Integer luctus fringilla lorem, mattis vehicula leo aliquam in. Integer finibus et enim a ornare.

Morbi interdum ultricies magna, in lacinia eros ultricies sit amet. Sed placerat imperdiet risus et viverra. Sed suscipit pulvinar ligula, vitae tristique nisi pulvinar nec. Integer molestie finibus tortor, et gravida enim efficitur vitae. Etiam eget risus nec diam bibendum pellentesque. Sed finibus eros leo, id tempor ante mattis sit amet. In ipsum lectus, consectetur venenatis consectetur sit amet, tincidunt non massa. Pellentesque vulputate semper nibh, sit amet gravida enim. Pellentesque fermentum nec massa ut consequat. Quisque tincidunt vestibulum ornare. Duis eu lacinia odio, at feugiat neque. Pellentesque maximus ipsum vitae felis sodales, ut rutrum augue bibendum. Integer sit amet magna urna. Aliquam erat volutpat. Suspendisse eleifend dictum mi, sit amet varius turpis sodales eget.3

Section Delta

Nulla facilisi. Integer auctor mauris odio, facilisis volutpat dolor lobortis quis. Sed sagittis aliquam enim quis volutpat. Aliquam erat volutpat. Pellentesque at felis faucibus, varius mi non, ultrices nunc. Suspendisse vulputate vehicula turpis vel maximus. Sed id velit a risus rhoncus aliquet id nec est. Curabitur consectetur tortor egestas orci aliquam fermentum. Morbi dictum, nisl nec lacinia varius, neque ligula vulputate purus, vitae fringilla nulla erat nec dolor. Suspendisse potenti. Aliquam erat volutpat. Proin felis lorem, maximus vitae mi non, pharetra gravida libero. Curabitur gravida purus et laoreet vehicula. Ut at felis augue. Mauris non viverra lacus. Donec eu odio ultrices, porta lacus sit amet, consequat mi.

Vestibulum tristique, mi nec mollis dictum, diam ipsum laoreet eros, ac aliquet odio libero eget ante. Suspendisse imperdiet vehicula tincidunt. Nullam tincidunt, arcu congue tempor vulputate, turpis risus suscipit urna, ut feugiat lacus dolor vel orci. In nec magna justo. Nullam mattis pulvinar turpis, sed egestas metus elementum et. Sed pulvinar sed neque eget tincidunt. Vivamus laoreet justo quis justo accumsan bibendum. Donec commodo felis sed egestas efficitur. Nulla convallis vestibulum tempor. Praesent malesuada iaculis est, id ornare eros faucibus a. Sed facilisis arcu at laoreet rhoncus. Sed malesuada vitae odio sed posuere.

Section Epsilon

Sed congue a massa non volutpat. Pellentesque finibus odio quis odio ornare, ut cursus nibh lobortis. Mauris pretium a urna eu congue. Praesent malesuada diam et mi facilisis hendrerit. Sed mollis sit amet dolor vel ullamcorper. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Pellentesque cursus nulla odio, ac pellentesque eros egestas nec. Nullam in purus a nisl tristique facilisis et id magna. Maecenas id eros sit amet ligula vestibulum rhoncus non quis nibh. Integer condimentum convallis libero, vel bibendum justo. Curabitur non justo nec est finibus ultrices sit amet non massa. Pellentesque sapien orci, posuere vitae feugiat id, finibus vel mauris. Sed pretium, lorem eget tempor elementum, arcu libero rhoncus augue, et sollicitudin erat mi vitae lacus. Donec aliquet nisl in purus vulputate, vitae convallis lacus volutpat.

Nam vitae magna at libero bibendum mollis. Sed in lacus hendrerit, ornare tortor in, interdum velit. Praesent vestibulum leo eget erat bibendum auctor. Etiam aliquet felis eu maximus ultrices. Nulla aliquam, eros sollicitudin faucibus lobortis, mauris nisl tristique nisl, et fringilla neque lorem eu nisl. Sed eu porttitor ex. Maecenas mollis felis vel ipsum pharetra varius. Nam vestibulum in turpis non mattis. Nullam consequat metus id ipsum fermentum, id accumsan mi aliquet. Suspendisse potenti. Duis condimentum venenatis condimentum. Cras augue nunc, ultrices in blandit eget, malesuada sed purus. Integer tempor, libero eget sodales vulputate, risus justo faucibus mi, vitae lobortis nulla nisl ut eros. Vivamus porttitor maximus dictum.

Tabled Content

CategoryDescriptionExample
HighlightDonec vulputate ligula nisl, a pulvinar enim rhoncus sed.highlighted()
ReferenceNulla pellentesque erat id ligula dictum, gravida porttitor nisi efficitur.Reference text
ContextSuspendisse nunc neque, pellentesque ac massa sed, posuere varius dui.Contextual cues
OutcomeEtiam posuere velit nec massa aliquet condimentum.Success path

Praesent ornare arcu vitae nibh convallis cursus. Pellentesque ac neque risus. Nulla facilisi. Sed nisl lorem, mollis a odio sit amet, dictum ultricies mauris. Suspendisse eget ipsum nec sem commodo eleifend. Nulla pharetra ante eu dui porttitor pellentesque. Vestibulum lacinia purus vitae arcu aliquam, vitae ultrices mi pellentesque. Praesent feugiat est sed odio laoreet tempus. Etiam vestibulum aliquet risus, id porta leo suscipit eget.4

Detailed Walkthroughs

Step-by-Step Narrative

  1. Begin with a precise description that explains the workflow and ties every action back to a practical goal; lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce hendrerit turpis sed lacus porta, id suscipit urna faucibus.
  2. Analyze context by referencing supporting material and by sprinkling in clarifying statements, etiam laoreet nulla nec condimentum egestas.
  3. Execute the sequence, verifying that each sub-step remains legible; proin ullamcorper semper elit, ut varius purus varius at.
  4. Wrap up with reflections, morbi ac arcu hendrerit, ornare ipsum non, rutrum lectus.

Supporting Paragraphs

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus sed sapien dui. Proin molestie volutpat venenatis. Pellentesque efficitur luctus nibh quis luctus. Nullam odio odio, posuere fermentum pretium eget, fermentum vitae lectus. Duis a ipsum augue. Pellentesque eu dui ac odio feugiat euismod vitae vitae neque. Donec massa nisl, pellentesque eget metus fermentum, vehicula cursus tellus. Suspendisse venenatis justo nisi, in laoreet neque feugiat quis. Curabitur auctor interdum facilisis. Nulla vel convallis magna. Vestibulum aliquet sapien quis ante vehicula, vitae vulputate est fermentum. Pellentesque hendrerit, dui vel accumsan ornare, neque massa dictum erat, ac imperdiet mauris nulla at lorem.

Sed posuere fermentum lacus, efficitur tincidunt mauris luctus eget. Etiam sed tempor erat. Etiam vel gravida leo, vel elementum ipsum. Integer consequat sagittis sem id blandit. Pellentesque rutrum sed ante non molestie. Suspendisse rhoncus urna at urna molestie, ut faucibus dui porttitor. Suspendisse potenti. Fusce et dictum enim. Donec pulvinar quam non leo interdum malesuada. Phasellus consectetur lacus non dolor placerat, at tempor urna interdum. Phasellus tempor facilisis iaculis. Pellentesque pharetra convallis libero non dignissim.

PhaseFocusOutcome
DiscoverAudit the existing IIIF content inventory.Notebook of manifests
PlanDefine metadata priorities and markdown sections.Structured outline
BuildCompose MDX, integrate components, review styling.Drafted site
ValidatePreview locally and gather reviewer feedback.Approved launch

Variations on Formatting

  • Bold statements stress an argument amid the flowing lorem ipsum pattern.
  • Italic commentary signals a conceptual aside that still matters.
  • inline snippets highlight commands or props like iiifContent.
  • Combination text such as bold italic cues works for design tokens like bg-brand.
  1. Ordered sequences remain useful when presenting API request steps.
  2. Long enumerations may include supporting details that reference the earlier sections for continuity.
  3. Inline formulas such as n = a^2 + b^2 survive inside a list without disruption.

Footnote Practice and References

Content that cites sources can place footnote markers at convenient pauses. Donec efficitur augue ut lacus tristique, sed facilisis massa facilisis. Nulla imperdiet nisi sed ante lacinia gravida. Nullam imperdiet nisl id orci varius malesuada. Sed iaculis nisl in nulla imperdiet, semper pulvinar nibh finibus. Pellentesque dictum arcu lorem, vitae tempor leo mollis id. Mauris finibus orci sit amet ante tristique accumsan. Vestibulum rutrum tellus sit amet sollicitudin tempor5, and ut cursus arcu dolor, in euismod sem rutrum non.

Curabitur rutrum congue maximus. Donec pharetra quam ac pretium blandit. Nam interdum erat ac eros blandit, at maximus orci accumsan. Sed at fermentum odio. Praesent eu libero eu ipsum tempor luctus sed eget est. Maecenas felis ipsum, suscipit eget iaculis in, dapibus non nibh. Cras fermentum augue eget augue convallis porta. Sed eget placerat libero, eget lacinia leo. Mauris lobortis tincidunt velit nec vulputate. Vestibulum lacus quam, iaculis sit amet dictum eget, consequat at eros.

Closing Thoughts

The concluding section reaffirms that markdown offers countless expressive opportunities, from inline styling to interactive lists. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nisl purus, mollis sed neque vel, commodo porttitor metus. Sed facilisis nisi sit amet justo aliquet, non porttitor odio luctus. Integer tincidunt diam nec mi pulvinar, in sed felis faucibus. Morbi fermentum lacus sit amet ligula bibendum malesuada. Vestibulum ac urna libero. Sed posuere et ipsum in eleifend. Duis imperdiet aliquet enim optio. Pellentesque augue arcu, gravida in sagittis vitae, malesuada varius justo. Duis vestibulum odio non ligula vehicula pellentesque. Integer volutpat iaculis orci, sed feugiat magna varius vitae.6

Footnotes

  1. Syntax rules apply equally to MDX frontmatter, markup, and component usage; clarity beats brevity when sharing instructions. ↩

  2. Deep dive: This paragraph evokes the slow-burn rhythm of a reference chapter; notice how the cadence mirrors documentation specs while the surrounding prose maintains a measured, academic register that rewards careful reading. The observation underscores how rhetorical pacing nudges readers toward methodological thinking. ↩

  3. Research log — Even when prose wanders through compositional theory, remember that consistency in terminology and spacing keeps the UI vocabulary aligned with archival practice. Scholars frequently point out that such stylistic unity reduces cognitive load, especially when readers toggle between technical annotation and narrative framing. ↩

  4. Diagram reminder: Think of multi-column comparisons as living spreadsheets; italic callouts like per-column nuance keep design guidelines precise while maintaining descriptive integrity. This analytical framing mirrors techniques from information science curricula where tables are treated as miniature arguments. ↩

  5. Etiam bibendum condimentum quam vitae aliquet. Donec blandit tortor tortor, id sollicitudin ligula interdum sit amet. ↩

  6. Final aside: markdown closing sections benefit from a touch of narrative; weave bold emphasis (celebrate the craft) with explicit references to deployment contexts so the conclusion feels connected to real-world pipelines. In many editorial workflows, this reflective turn also sets the stage for peer review or user testing. ↩