Test

This tailwind example is contributed by Michael Kernbichler, on 18-Dec-2024. Component is made with Tailwind CSS v3. It is responsive. similar terms for this example are endorsement,review

Testimonial

Author Michael Kernbichler

Fork Fullscreen

<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <link href="./output.css" rel="stylesheet" />
  <script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.14.7/dist/cdn.min.js"></script>
  <script>
    document.addEventListener("alpine:init", () => {
        Alpine.directive("reveal", (el, {}, { cleanup }) => {
          const callback = () => {
            // Check if the element is within 70% of the screen
            const position = el.offsetTop - window.scrollY
            const threshold = window.scrollY + window.innerHeight * 0.1
            const reveal = position < threshold
    
            // Ignore if the element doesn't reach the threshold
            if (!reveal) {
              return
            }
    
            // Add css classes to set the opacity to 100 and the offset to 0
            // We also use a 0.2 second delay
            setTimeout(() => {
              el.classList.add(
                "!opacity-100",
                "!top-0",
                "transition-all",
                "duration-300",
              )
            }, 200)
          }
    
          setTimeout(() => callback(), 0)
    
          // Setup to reveal the element when the user scrolls
          window.addEventListener("scroll", callback)
          cleanup(() => {
            window.removeEventListener("scroll", callback)
          })
        })
      })
  </script>
  <title>International Design Week 2025</title>
</head>

<div class="wrapper md:wrapper-md lg:wrapper-lg">
    <div class="header">
      <div class="header-img md:hidden lg:hidden"></div>
      <div class="header-logo md:header-logo-md lg:header-logo-lg"></div>
    </div>
    <div class="content md:content-md lg:content-lg">
      <div class="h2-small md:h2-medium lg:h2-large">
        International Design Week 2025<br />
          May 9 – 16, 2025 / Graz / Austria
      </div>
      <div class="txt-stretch copy-small  md:copy-medium lg:copy-large">
        Institute of Design & Communication, FH JOANNEUM Graz<br>
          Including an invitation to the Grand Opening weekend of the festival<br>
          “Design Month Graz 2025” by Creative Industries Styria
      </div>

<p class="h2-small txt-stretch md:h2-medium lg:h2-large">
        We are thrilled to announce the 4th edition of the International
        Design Week at the Institute of Design & Communication, FH JOANNEUM
        University of Applied Sciences, as part of the Design Month Graz 2025
        in our UNESCO City of Design Graz. Following the success of our
        previous themes – The Prepper, mutate or mute, and Design Science
        F®ictions – we now delve into the complex layers of unCOMMON
        underGROUND.
      </p>
      <br>
      <div class="h1-small txt-stretch md:h1-medium lg:h1-large">
        Call for <br />Workshop Proposals
      </div>
      <p class="h4-small txt-stretch md:h4-medium lg:h4-large">
        We invite proposals for workshops for the 2025 International Design
        Week under the theme unCOMMON underGROUND. We are looking for
        innovative and thought-provoking sessions that explore and dissect the
        multiple layers of ”common ground,” ”underground,” and the ”uncommon.”
        Workshops should encourage students to critically engage with topics
        like design and politics, communication and media ethics,
        misinformation, cultural exchange, and the creative spaces in between.
      </p>
      <br>

<div class="container-bp">
        <div class="h3-small txt-stretch md:h3-medium lg:h3-large">
          Workshop Format and Requirements
        </div>
        <ul class="list-disc h4-small txt-stretch md:h4-medium lg:h4-large">
          <li>
            Cross-Media Focus: Workshops should promote collaboration across
            design disciplines. Consider combinations like illustration x
            immersion, sound x spatial design, graphic x interactive
            experiences, or editorial x video storytelling…
          </li>
          <li>
            Hands-on Methodologies: Emphasize active participation,
            prototyping, and tangible outcomes. We aim to foster an immersive
            learning environment where students can experiment and apply their
            skills.
          </li>
          <li>
            Theme Integration: Your workshop should creatively interpret the
            unCOMMON underGROUND theme, whether exploring hidden narratives,
            ethical dilemmas, or the power of communication in creating or
            disrupting peace and understanding.
          </li>
          <li>
            Inclusivity and Diversity: Workshops must cater to first-year
            bachelor’s students from Information Design and master’s students
            from programs in Exhibition, Communication, Sound, Media, and
            Interaction Design. In addition, workshops should be accessible to
            incoming students from our international partners` network.
            Consider adaptable approaches suitable for all levels of
            experience and backgrounds.
          </li>
          <li>
            Workshop Duration: All workshops are 4-days, Monday – Thursday 10
            am to 5 pm, final presentations take place on Friday.
          </li>
          <li>Workshop Size: 9 – 14 students per workshop</li>
          <li>Workshop Language: English.</li>
        </ul>
        <br />
        <p class="h4-small txt-stretch md:h4-medium lg:h4-large">
          If you are ready to challenge traditional perspectives and push the
          boundaries of design practice with your workshop, we welcome your
          proposal. Let’s dig deep and unearth the future of design together!
        </p>
      </div>
      <div x-data x-reveal>
        <div class="logo-sm-sticky md:logo-md-sticky lg:logo-lg-sticky">

</div>
      </div>

<p class="h4-small txt-stretch md:h4-medium lg:h4-large">
        <span class="h3-small txt-stretch md:h3-medium lg:h3-large">
            Submission and Conditions
          </span><br>
          Lecturers interested in applying are requested to submit a proposal
          for a 4-day workshop including the following until
        <span class="blue">February 5, 2025</span>, via Online Form:
        <a href="https://forms.fh-joanneum.at/misc/international-design-week/" class="blue underline">
          ->->-></a>
      </p>
      <ul class="list-disc h4-small txt-stretch md:h4-medium lg:h4-large">
        <li>Workshop title</li>
        <li>Indication of applied design disciplines (2-3)</li>
        <li>
          Description of the workshop concept and content (including goals and
          methods)
        </li>
        <li>Intended learning outcomes (including learned design skills)</li>
        <li>Intended outcome (hands-on result)</li>
        <li>
          Alignment with the theme unCOMMON underGROUND (How does your topic
          align with the theme?)
        </li>
        <li>
          Equipment/Facilities/Materials (needed from idk/provided by
          lecturer)
        </li>
        <li>Link to your design portfolio / research portfolio</li>
        <li>Link to student works from previous classes (optional)</li>
        <li>Short CV</li>
      </ul>

<p class="h4-small txt-stretch md:h4-medium lg:h4-large">
        Participants are expected to obtain an Erasmus+ mobility grant (STA)
        from their home institution to cover the travel, living and
        accommodation expenses related to their participation in the event. We
        ask participants to stay for the entire duration of the International
        Design Week (May 9 to 16, 2025).
        <br /><br />
          We look forward to your unique and engaging workshop ideas!
      </p>
      <br>
      <div class="h3-small txt-stretch md:h3-medium lg:h3-large">
        About the institutions
      </div>

<p class="h4-small txt-stretch md:h4-medium lg:h4-large">
        <span class="blue"> Institute of Design & Communication (idk)</span><br />
          The Institute of Design & Communication, one of the largest institutes
          at the FH JOANNEUM, with around 300 students, contributes to the
          creative dynamics of the city of Graz. Competence in design,
          human-centered methods and research are important elements in our
          interdisciplinary education. Research at the institute encompasses
          contemporary design challenges in society in collaboration with
          industry and other academic institutions. The institute offers a
          bachelor’s program in Information Design and master’s programs in
          Exhibition Design and Communication, Media, Sound and Interaction
          Design. Our students learn to understand economic, social, cultural
          and technological backgrounds to effectively create design solutions
          for society as they shape tomorrow’s worlds.
        <br />
        <br />
        <a href="https://www.fh-joanneum.at/en/institut/design-communication/" class="underline">
          Institute of Design & Communication</a>
        <br />
        <a href="https://www.youtube.com/watch?v=1_frt7ues18" class="underline">
          Retrospective International Design Week 2024</a>
        <br />
        <a href="https://issuu.com/fhjoanneum/docs/idw_publikation_rz_1_" class="underline">
          Publication International Design Week 2024</a>
      </p>
      <p class="h4-small txt-stretch md:h4-medium lg:h4-large">
        <span class="blue"> Creative Industries Styria (CIS)</span><br />
          Creative Industries Styria is one of the central institutions
          promoting design and culture regionally and internationally. As one of
          49 UNESCO Cities of Design in the world, the city of Graz creates
          awareness for design, art and culture, making them visible and
          perceivable in our society. Every year in May, the Design Month Graz
          organized by CIS showcases design from local and international
          creatives. From May 9 to June 1, 2025, an extensive and diverse
          program including exhibitions, lectures and workshops will take place
          across the region.
        <br />
        <br />
        <a href="https://www.cis.at/" class="underline">
          Creative Industries Styria</a>
        <br />
        <a href="https://www.designmonat.at/en/" class="underline">
          Design Month 2025</a>
        <br />
        <a href="https://www.youtube.com/watch?v=S2ASN9lr4zI" class="underline">
          Retrospective Design Month 2024</a>
      </p>
      <br>
      <div class="h3-small txt-stretch md:h3-medium lg:h3-large">
        Preliminary Program
      </div>
      <p class="h4-small txt-stretch md:h4-medium lg:h4-large">
        <span class="blue"> Fri, May 9 </span><br />2 pm<br />
          International Welcome at the<br />
          Institute of Design and Communication<br /><br />
          Evening <br />Opening of the festival “Design Month Graz 2025”<br /><br /><span
            class="blue"
          >
            Sat, May 10</span><br />
          All day <br />Design Month Graz activities, walks, talk and
          exhibitions<br /><br />
        <span class="blue"> Sun, May 11</span> <br />11 am to 8 pm<br />
          Design Month Graz excursion to the countryside<br /><br />
        <span class="blue"> Mon, May 12 – Thu, May 15</span><br />
          9 am <br />Lightning Lecture on different topics within the theme<br /><br />
          10 am to 5 pm Workshop Days 1 – 4<br />
          (warm up & research, experiment, consolidate, finalize)
        <br /><br /><span class="blue"> Fri, May 16</span><br />
          9 am to 1 pm<br />
          Final presentations <br /><br />2 pm to 4 pm<br />
          Farewell lunch
      </p>
      <br>

<ul class="list-disc h4-small txt-stretch md:h4-medium lg:h4-large">
        <div class="h3-small txt-stretch md:h3-medium lg:h3-large">
          Available facilities
        </div>
        <li>Photo studio and video studio (green screen & lighting)</li>
        <li>Audio studio and recording booth</li>
        <li>Workshop (basic woodworking, soldering)</li>
        <li>
          Prototyping lab (laser cutter, 3D printer, embroidery machine)
        </li>
        <li>Print studio (plotter, risograph, vinyl cutter)</li>
        <li>
          Vision Space (3D projection, audio spatialisation, motion tracking)
        </li>
        <li>
          Media Center (equipment rental: cameras, VR glasses, microcontroller
          kits...)
        </li>
      </ul>

<p class="h4-small txt-stretch md:h4-medium lg:h4-large">
        <span class="h3-small txt-stretch md:h3-medium lg:h3-large">
            Accommodation
          </span><br>
          We recommend Hotel Daniel, but of course guest are free to choose any
          accomodation they prefer. Hotel Daniel is located at the train station
          and near FH JOANNEUM (10 min walk). As FH JOANNEUM guest you will a
          receive a special rate. More information will be provided by
          acceptance.
      </p>

<p class="h4-small txt-stretch md:h4-medium lg:h4-large">
        <span class="h3-small txt-stretch md:h3-medium lg:h3-large">
            Timeline
          </span><br>
          Proposal submission deadline:
        <span class="blue">February 5, 2025 (23:59 CET)</span><br />
          Notification of acceptance:
        <span class="blue">by February 28, 2025</span><br />
          International Design Week:<span class="blue"> May 9 – 16, 2025</span><br />
      </p>

<p class="h4-small txt-stretch md:h4-medium lg:h4-large">
        <span class="h3-small txt-stretch md:h3-medium lg:h3-large">
            Contact
          </span><br>
          For any questions, please contact<br>
        <a href="mailto:andrea.schlacher@fh-joanneum.at" class="underline">
          andrea.schlacher@fh-joanneum.at</a>.
        <br>
        <br>
        <span class="blue">Andrea Schlacher</span> <br>
International Coordinator <br>
Institute of Design and Communication (idk) <br>
FH JOANNEUM Gesellschaft mbH <br>
Alte Poststraße 152 <br>
8020 Graz / Austria

</p>
      <div class="logo-sm md:logo-md lg:logo-lg">
      </div>

</div>
  </div>

</div>

</body>

</html>

Related Examples

Designing a Responsive Activity Feed with Tailwind CSS
Enhance your web application by building a sleek and responsive activity feed using Tailwind CSS. This comprehensive guide walks you through creating an interactive feed section featuring customizable icons, links, and timestamps. Learn how to implement a visually appealing and accessible timeline that adapts seamlessly to any device, improving user engagement and overall experience

Author:
zobaidul kaziex

1 year ago

2.5k
Testimonial examples in Tailwind CSS
Here are some testimonial section examples using Tailwind CSS:

Author:
zobaidul kaziex

1 year ago

1.5k
Testimonial wall
added light mode support

Author:
yousef

1 year ago

3.2k
Testimonial card

Author:
Leon Bachmann

3 years ago

12.1k
Twitter testimonial card

Author:
wtfbrh

1 year ago

1.8k
Enhanced Student Testimonials Section
A modern, interactive testimonials section featuring glassmorphism design, floating animations, and social proof elements. Includes star ratings, course badges, user profiles with online status indicators, and a stats section. Built with Tailwind CSS and features gradient backgrounds, hover effects, and responsive design optimized for showcasing student success stories and building credibility.

Author:
Muhammad Umair Arshad

5 months ago

551
Testimonials

$$@(\/)(\/)¥$ Author:
$@(\/)(\/)¥

9 months ago

1.7k
Testimonial Card

Author:
Anonymous

1 year ago

963
Twitter Testimonials Showcase with Tailwind CSS

Author:
EliteAI Tools

10 months ago

1.2k
Tailwind testimonials section

Author:
Kofi Osei

2 years ago

12.8k
Testimonial Section
A responsive, SEO-friendly testimonial section for Ab Nahid Agency clients

Author:
Abdul Jabbar Al Nahid

6 months ago

565
Testimonial Card with Gradient Background

Author:
Quentin Rivers

1 year ago

1.9k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components