Organisms

Organisms zijn complexe componenten die zijn opgebouwd uit meerdere atomen en moleculen. Ze bieden een hogere mate van functionaliteit en kunnen zelfstandig functioneren binnen de gebruikersinterface.

Hero Section

Hero sectie voor prominente content met achtergrondafbeelding, titel, subtitel en call-to-action.

Hero background

Digitale transformatie voor de publieke sector

Wij helpen overheden met het ontwerpen en bouwen van moderne digitale diensten die écht werken voor inwoners.

Ontdek onze aanpak Bekijk projecten 
<!-- Hero showcase -->
<div class="o-hero">
    <div class="o-hero__background">
<img src="https://cdn.tiltshift.nl/assets/img/Information-Radiator-War-Room-Wand-met-Stickies.jpg" alt="Hero background" loading="lazy">
    </div>
    <div class="o-hero__content">
<h1 class="a-heading a-text-3 o-hero__title">Digitale transformatie voor de publieke sector</h1>
<p class="a-text a-text-2 a-m-0 o-hero__subtitle">Wij helpen overheden met het ontwerpen en bouwen van moderne digitale diensten die écht werken voor inwoners.</p>
        <div class="o-hero__actions">
<a href="#" 
   class="a-button a-clickable a-hoverable ts-button ts-button--primary a-px-4 a-py-2 a-rounded">Ontdek onze aanpak</a>
<a href="#" 
   class="a-button a-clickable a-hoverable ts-button ts-button--secondary a-bg-white a-text-primary a-px-4 a-py-2 a-rounded a-ml-3">Bekijk projecten</a>
        </div>
    </div>
</div>

Project Grid

Grid layout voor project previews met hover effecten en metadata.

Makkelijke Markt
Bekijk project
Gemeente Amsterdam

Makkelijke Markt

Een digitale oplossing voor marktondernemers om gemakkelijker een standplaats aan te vragen.

Design Thinking UX Research
Digitaal Indelen Straatmarkten
Bekijk project
Gemeente Amsterdam

Digitaal Indelen Straatmarkten

Algoritmes voor eerlijke verdeling van standplaatsen op Amsterdamse markten.

Python Machine Learning
Digitale Dienstverlening
Bekijk project
Gemeente Rotterdam

Digitale Dienstverlening

Verbetering van digitale dienstverlening voor inwoners met focus op toegankelijkheid.

Vue.js PHP MySQL 
<!-- Project grid showcase -->
<div class="o-project-grid ts-grid ts-grid--cols-3 ">
    <a href="#" class="o-project-grid__item">
        
        <div class="m-project-card a-card ">
    
    
    
    
    
    
    <div class="m-project-card__image a-image-container a-relative">
<img src="https://cdn.tiltshift.nl/assets/img/Empathy-Map-Gebruiken-Resultaten-Interviews-Verwerken.jpg" alt="Makkelijke Markt" loading="lazy">
        <div class="m-project-card__overlay a-overlay a-flex-center">
            <span class="a-text a-text-lg a-text-white">Bekijk project</span>
        </div>
    </div>
    <div class="m-project-card__content a-p-4">
        <div class="m-project-card__meta a-flex a-gap-2 a-mb-2">
            <span class="a-text a-text-sm">Gemeente Amsterdam</span>
        </div>
        <h4 class="a-heading a-text-3 m-project-card__title">Makkelijke Markt</h4>
        <p class="a-text a-text-2 a-m-0 m-project-card__description">Een digitale oplossing voor marktondernemers om gemakkelijker een standplaats aan te vragen.</p>
        
        <div class="m-project-card__tags a-flex a-gap-1">
            
                <span class="a-tag a-text a-bg-off-white ts-label">Design Thinking</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">UX Research</span>
            
        </div>
        
    </div>
</div>
    </a>
    
    <a href="#" class="o-project-grid__item">
        
        <div class="m-project-card a-card ">
    
    
    
    
    
    
    <div class="m-project-card__image a-image-container a-relative">
<img src="https://cdn.tiltshift.nl/assets/img/Straatnotes-Straatcoaches-op-Straat-software-jeugdoverlast-terugdringen.jpg" alt="Digitaal Indelen Straatmarkten" loading="lazy">
        <div class="m-project-card__overlay a-overlay a-flex-center">
            <span class="a-text a-text-lg a-text-white">Bekijk project</span>
        </div>
    </div>
    <div class="m-project-card__content a-p-4">
        <div class="m-project-card__meta a-flex a-gap-2 a-mb-2">
            <span class="a-text a-text-sm">Gemeente Amsterdam</span>
        </div>
        <h4 class="a-heading a-text-3 m-project-card__title">Digitaal Indelen Straatmarkten</h4>
        <p class="a-text a-text-2 a-m-0 m-project-card__description">Algoritmes voor eerlijke verdeling van standplaatsen op Amsterdamse markten.</p>
        
        <div class="m-project-card__tags a-flex a-gap-1">
            
                <span class="a-tag a-text a-bg-off-white ts-label">Python</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">Machine Learning</span>
            
        </div>
        
    </div>
</div>
    </a>
    
    <a href="#" class="o-project-grid__item">
        
        <div class="m-project-card a-card ">
    
    
    
    
    
    
    <div class="m-project-card__image a-image-container a-relative">
<img src="https://cdn.tiltshift.nl/assets/img/Gemeentelijk-DataLab-oprichten-Amsterdam.jpg" alt="Digitale Dienstverlening" loading="lazy">
        <div class="m-project-card__overlay a-overlay a-flex-center">
            <span class="a-text a-text-lg a-text-white">Bekijk project</span>
        </div>
    </div>
    <div class="m-project-card__content a-p-4">
        <div class="m-project-card__meta a-flex a-gap-2 a-mb-2">
            <span class="a-text a-text-sm">Gemeente Rotterdam</span>
        </div>
        <h4 class="a-heading a-text-3 m-project-card__title">Digitale Dienstverlening</h4>
        <p class="a-text a-text-2 a-m-0 m-project-card__description">Verbetering van digitale dienstverlening voor inwoners met focus op toegankelijkheid.</p>
        
        <div class="m-project-card__tags a-flex a-gap-1">
            
                <span class="a-tag a-text a-bg-off-white ts-label">Vue.js</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">PHP</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">MySQL</span>
            
        </div>
        
    </div>
</div>
    </a>
</div>

People Grid

Grid layout voor people cards met foto's, namen en rollen.

Johan Groenen

Johan Groenen

Partner & Strategist

Joris Boeren

Joris Boeren

Partner & Developer

Maarten Geraets

Maarten Geraets

Partner & Designer

<!-- People grid showcase -->
<div class="o-people-grid ts-grid ts-grid--cols-3 ">
    
        
<div class="m-people-card a-block ts-person-block a-min-w-48 ">

    
    
    
    <div class="a-rounded-md a-overflow-hidden a-mx-auto a-mb-3 ts-person-block__image">
<img src="https://cdn.tiltshift.nl/assets/mensen/Johan-Groenen-Partner-Tiltshift.jpg" alt="Johan Groenen" loading="lazy">
    </div>
    <h4 class="a-heading a-text-3 a-mb-1 ts-person-block__name">Johan Groenen</h4>
    <p class="a-text a-text-sm a-m-0 ts-person-block__type">Partner & Strategist</p>

</div>

    
        
<div class="m-people-card a-block ts-person-block a-min-w-48 ">

    
    
    
    <div class="a-rounded-md a-overflow-hidden a-mx-auto a-mb-3 ts-person-block__image">
<img src="https://cdn.tiltshift.nl/assets/mensen/Joris-Boeren-Partner-Tiltshift.jpg" alt="Joris Boeren" loading="lazy">
    </div>
    <h4 class="a-heading a-text-3 a-mb-1 ts-person-block__name">Joris Boeren</h4>
    <p class="a-text a-text-sm a-m-0 ts-person-block__type">Partner & Developer</p>

</div>

    
        
<div class="m-people-card a-block ts-person-block a-min-w-48 ">

    
    
    
    <div class="a-rounded-md a-overflow-hidden a-mx-auto a-mb-3 ts-person-block__image">
<img src="https://cdn.tiltshift.nl/assets/mensen/Maarten-Geraets-Partner-Tiltshift.jpg" alt="Maarten Geraets" loading="lazy">
    </div>
    <h4 class="a-heading a-text-3 a-mb-1 ts-person-block__name">Maarten Geraets</h4>
    <p class="a-text a-text-sm a-m-0 ts-person-block__type">Partner & Designer</p>

</div>

    
</div>

Organization Grid

Grid layout voor organization cards met logo's, types en beschrijvingen.

Gemeente

Gemeente Amsterdam

Samen werken aan digitale dienstverlening voor alle Amsterdammers.

Provincie

Provincie Flevoland

Innovatieve oplossingen voor provinciale dienstverlening en gebiedsontwikkeling.

Gemeente

Gemeente Rotterdam

Moderne digitale diensten voor een diverse en dynamische stad.

 
<!-- Organization grid showcase -->
<div class="o-organization-grid ts-grid ts-grid--cols-3 ">
    
        
<a href="#" class="m-organization-card a-block a-clickable ts-organization-block ">

    
    
    
    
    
    <div class="m-organization-card__logo a-mb-3">
<img src="https://cdn.tiltshift.nl/assets/opdrachtgevers/gemeente-amsterdam.png" alt="Gemeente Amsterdam" class="a-max-h-16" loading="lazy">
    </div>
    <p class="a-text a-text-sm a-text-gray-600 a-m-0 m-organization-card__type a-mb-1">Gemeente</p>
    <h4 class="a-heading a-text-3 m-organization-card__name a-mb-2">Gemeente Amsterdam</h4>
    <p class="a-text a-text-sm a-m-0 m-organization-card__description">Samen werken aan digitale dienstverlening voor alle Amsterdammers.</p>

</a>

    
        
<a href="#" class="m-organization-card a-block a-clickable ts-organization-block ">

    
    
    
    
    
    <div class="m-organization-card__logo a-mb-3">
<img src="https://cdn.tiltshift.nl/assets/opdrachtgevers/provincie-flevoland.png" alt="Provincie Flevoland" class="a-max-h-16" loading="lazy">
    </div>
    <p class="a-text a-text-sm a-text-gray-600 a-m-0 m-organization-card__type a-mb-1">Provincie</p>
    <h4 class="a-heading a-text-3 m-organization-card__name a-mb-2">Provincie Flevoland</h4>
    <p class="a-text a-text-sm a-m-0 m-organization-card__description">Innovatieve oplossingen voor provinciale dienstverlening en gebiedsontwikkeling.</p>

</a>

    
        
<a href="#" class="m-organization-card a-block a-clickable ts-organization-block ">

    
    
    
    
    
    <div class="m-organization-card__logo a-mb-3">
<img src="https://cdn.tiltshift.nl/assets/opdrachtgevers/gemeente-rotterdam.png" alt="Gemeente Rotterdam" class="a-max-h-16" loading="lazy">
    </div>
    <p class="a-text a-text-sm a-text-gray-600 a-m-0 m-organization-card__type a-mb-1">Gemeente</p>
    <h4 class="a-heading a-text-3 m-organization-card__name a-mb-2">Gemeente Rotterdam</h4>
    <p class="a-text a-text-sm a-m-0 m-organization-card__description">Moderne digitale diensten voor een diverse en dynamische stad.</p>

</a>

    
</div>

Subject Grid

Grid layout voor subject cards met categorieën, titels en beschrijvingen.

Default Subject Grid

Workshop

Design Thinking workshops

Samen met teams ontdekken we kansen en creëren we innovatieve oplossingen voor complexe uitdagingen.

1-3 dagen

Innovatie Co-creatie Strategie

Design

Prototyping en user testing

Snel ideeën valideren door werkende prototypes te bouwen en direct te testen met echte gebruikers.

2-4 weken

Validatie UX Testing

Development

Agile softwareontwikkeling

Flexibel en iteratief bouwen met continue feedback loops voor optimale resultaten.

Doorlopend

Scrum DevOps CI/CD

Subject Grid met data uit subjects.yml

Workshop

Design Thinking workshops

Samen met teams ontdekken we kansen en creëren we innovatieve oplossingen voor complexe uitdagingen.

1-3 dagen

Innovatie Co-creatie Strategie

Design

Prototyping en user testing

Snel ideeën valideren door werkende prototypes te bouwen en direct te testen met echte gebruikers.

2-4 weken

Validatie UX Testing

Development

Agile softwareontwikkeling

Flexibel en iteratief bouwen met continue feedback loops voor optimale resultaten.

Doorlopend

Scrum DevOps CI/CD

Research

User Research

Diepgaand onderzoek naar gebruikersbehoeften en gedrag voor betere producten.

2-6 weken

Interviews Analytics Insights

Data

Data analyse en visualisatie

Complexe data omzetten in heldere inzichten en interactieve dashboards.

Variabel

Analytics Dashboard BI

Training

Training en coaching

Teams opleiden in moderne werkwijzen en digitale vaardigheden.

1-5 dagen

Agile Skills Mindset 
<!-- Subject grid using default subjects from the organism -->
<div class="a-mb-8">
    <h3 class="a-title-sm a-mb-4">Default Subject Grid</h3>
    <div class="o-subject-grid ts-grid ts-grid--cols-3 ">
    <div class="o-subject-grid__item">
            
            
<div class="m-subject-card a-card ">

    
    
    
    
    
    <div class="m-subject-card__content a-p-4">
        <div class="m-subject-card__header a-mb-3">
            
                    <p class="a-text a-text-xs a-text-primary a-m-0 m-subject-card__category a-uppercase a-tracking-wide a-mb-1">Workshop</p>
                    <h4 class="a-heading a-text-3 m-subject-card__title">Design Thinking workshops</h4>
            
        </div>
        
        <p class="a-text a-text-2 a-m-0 m-subject-card__description a-mb-3">Samen met teams ontdekken we kansen en creëren we innovatieve oplossingen voor complexe uitdagingen.</p>
        
        
        <div class="m-subject-card__meta a-flex a-items-center a-gap-2 a-mb-3">
            <p class="a-text a-text-sm a-text-gray-600 a-m-0">1-3 dagen</p>
        </div>
        
        
        
        <div class="m-subject-card__tags a-flex a-gap-1 a-flex-wrap">
            
                <span class="a-tag a-text a-bg-off-white ts-label">Innovatie</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">Co-creatie</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">Strategie</span>
            
        </div>
        
    </div>

</div>

        </div>
        
        <div class="o-subject-grid__item">
            
            
<div class="m-subject-card a-card ">

    
    
    
    
    
    <div class="m-subject-card__content a-p-4">
        <div class="m-subject-card__header a-mb-3">
            
                    <p class="a-text a-text-xs a-text-primary a-m-0 m-subject-card__category a-uppercase a-tracking-wide a-mb-1">Design</p>
                    <h4 class="a-heading a-text-3 m-subject-card__title">Prototyping en user testing</h4>
            
        </div>
        
        <p class="a-text a-text-2 a-m-0 m-subject-card__description a-mb-3">Snel ideeën valideren door werkende prototypes te bouwen en direct te testen met echte gebruikers.</p>
        
        
        <div class="m-subject-card__meta a-flex a-items-center a-gap-2 a-mb-3">
            <p class="a-text a-text-sm a-text-gray-600 a-m-0">2-4 weken</p>
        </div>
        
        
        
        <div class="m-subject-card__tags a-flex a-gap-1 a-flex-wrap">
            
                <span class="a-tag a-text a-bg-off-white ts-label">Validatie</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">UX</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">Testing</span>
            
        </div>
        
    </div>

</div>

        </div>
        
        <div class="o-subject-grid__item">
            
            
<div class="m-subject-card a-card ">

    
    
    
    
    
    <div class="m-subject-card__content a-p-4">
        <div class="m-subject-card__header a-mb-3">
            
                    <p class="a-text a-text-xs a-text-primary a-m-0 m-subject-card__category a-uppercase a-tracking-wide a-mb-1">Development</p>
                    <h4 class="a-heading a-text-3 m-subject-card__title">Agile softwareontwikkeling</h4>
            
        </div>
        
        <p class="a-text a-text-2 a-m-0 m-subject-card__description a-mb-3">Flexibel en iteratief bouwen met continue feedback loops voor optimale resultaten.</p>
        
        
        <div class="m-subject-card__meta a-flex a-items-center a-gap-2 a-mb-3">
            <p class="a-text a-text-sm a-text-gray-600 a-m-0">Doorlopend</p>
        </div>
        
        
        
        <div class="m-subject-card__tags a-flex a-gap-1 a-flex-wrap">
            
                <span class="a-tag a-text a-bg-off-white ts-label">Scrum</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">DevOps</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">CI/CD</span>
            
        </div>
        
    </div>

</div>

        </div>
    
</div>
</div>

<!-- Subject grid with custom subjects from data file -->
<div class="a-mb-8">
    <h3 class="a-title-sm a-mb-4">Subject Grid met data uit subjects.yml</h3>
    <div class="o-subject-grid ts-grid ts-grid--cols-3 ">
    
        
        <div class="o-subject-grid__item">
            
<div class="m-subject-card a-card ">

    
    
    
    
    
    <div class="m-subject-card__content a-p-4">
        <div class="m-subject-card__header a-mb-3">
            
                    <p class="a-text a-text-xs a-text-primary a-m-0 m-subject-card__category a-uppercase a-tracking-wide a-mb-1">Workshop</p>
                    <h4 class="a-heading a-text-3 m-subject-card__title">Design Thinking workshops</h4>
            
        </div>
        
        <p class="a-text a-text-2 a-m-0 m-subject-card__description a-mb-3">Samen met teams ontdekken we kansen en creëren we innovatieve oplossingen voor complexe uitdagingen.</p>
        
        
        <div class="m-subject-card__meta a-flex a-items-center a-gap-2 a-mb-3">
            <p class="a-text a-text-sm a-text-gray-600 a-m-0">1-3 dagen</p>
        </div>
        
        
        
        <div class="m-subject-card__tags a-flex a-gap-1 a-flex-wrap">
            
                <span class="a-tag a-text a-bg-off-white ts-label">Innovatie</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">Co-creatie</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">Strategie</span>
            
        </div>
        
    </div>

</div>

        </div>
        
        <div class="o-subject-grid__item">
            
<div class="m-subject-card a-card ">

    
    
    
    
    
    <div class="m-subject-card__content a-p-4">
        <div class="m-subject-card__header a-mb-3">
            
                    <p class="a-text a-text-xs a-text-primary a-m-0 m-subject-card__category a-uppercase a-tracking-wide a-mb-1">Design</p>
                    <h4 class="a-heading a-text-3 m-subject-card__title">Prototyping en user testing</h4>
            
        </div>
        
        <p class="a-text a-text-2 a-m-0 m-subject-card__description a-mb-3">Snel ideeën valideren door werkende prototypes te bouwen en direct te testen met echte gebruikers.</p>
        
        
        <div class="m-subject-card__meta a-flex a-items-center a-gap-2 a-mb-3">
            <p class="a-text a-text-sm a-text-gray-600 a-m-0">2-4 weken</p>
        </div>
        
        
        
        <div class="m-subject-card__tags a-flex a-gap-1 a-flex-wrap">
            
                <span class="a-tag a-text a-bg-off-white ts-label">Validatie</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">UX</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">Testing</span>
            
        </div>
        
    </div>

</div>

        </div>
        
        <div class="o-subject-grid__item">
            
<div class="m-subject-card a-card ">

    
    
    
    
    
    <div class="m-subject-card__content a-p-4">
        <div class="m-subject-card__header a-mb-3">
            
                    <p class="a-text a-text-xs a-text-primary a-m-0 m-subject-card__category a-uppercase a-tracking-wide a-mb-1">Development</p>
                    <h4 class="a-heading a-text-3 m-subject-card__title">Agile softwareontwikkeling</h4>
            
        </div>
        
        <p class="a-text a-text-2 a-m-0 m-subject-card__description a-mb-3">Flexibel en iteratief bouwen met continue feedback loops voor optimale resultaten.</p>
        
        
        <div class="m-subject-card__meta a-flex a-items-center a-gap-2 a-mb-3">
            <p class="a-text a-text-sm a-text-gray-600 a-m-0">Doorlopend</p>
        </div>
        
        
        
        <div class="m-subject-card__tags a-flex a-gap-1 a-flex-wrap">
            
                <span class="a-tag a-text a-bg-off-white ts-label">Scrum</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">DevOps</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">CI/CD</span>
            
        </div>
        
    </div>

</div>

        </div>
        
        <div class="o-subject-grid__item">
            
<div class="m-subject-card a-card ">

    
    
    
    
    
    <div class="m-subject-card__content a-p-4">
        <div class="m-subject-card__header a-mb-3">
            
                    <p class="a-text a-text-xs a-text-primary a-m-0 m-subject-card__category a-uppercase a-tracking-wide a-mb-1">Research</p>
                    <h4 class="a-heading a-text-3 m-subject-card__title">User Research</h4>
            
        </div>
        
        <p class="a-text a-text-2 a-m-0 m-subject-card__description a-mb-3">Diepgaand onderzoek naar gebruikersbehoeften en gedrag voor betere producten.</p>
        
        
        <div class="m-subject-card__meta a-flex a-items-center a-gap-2 a-mb-3">
            <p class="a-text a-text-sm a-text-gray-600 a-m-0">2-6 weken</p>
        </div>
        
        
        
        <div class="m-subject-card__tags a-flex a-gap-1 a-flex-wrap">
            
                <span class="a-tag a-text a-bg-off-white ts-label">Interviews</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">Analytics</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">Insights</span>
            
        </div>
        
    </div>

</div>

        </div>
        
        <div class="o-subject-grid__item">
            
<div class="m-subject-card a-card ">

    
    
    
    
    
    <div class="m-subject-card__content a-p-4">
        <div class="m-subject-card__header a-mb-3">
            
                    <p class="a-text a-text-xs a-text-primary a-m-0 m-subject-card__category a-uppercase a-tracking-wide a-mb-1">Data</p>
                    <h4 class="a-heading a-text-3 m-subject-card__title">Data analyse en visualisatie</h4>
            
        </div>
        
        <p class="a-text a-text-2 a-m-0 m-subject-card__description a-mb-3">Complexe data omzetten in heldere inzichten en interactieve dashboards.</p>
        
        
        <div class="m-subject-card__meta a-flex a-items-center a-gap-2 a-mb-3">
            <p class="a-text a-text-sm a-text-gray-600 a-m-0">Variabel</p>
        </div>
        
        
        
        <div class="m-subject-card__tags a-flex a-gap-1 a-flex-wrap">
            
                <span class="a-tag a-text a-bg-off-white ts-label">Analytics</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">Dashboard</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">BI</span>
            
        </div>
        
    </div>

</div>

        </div>
        
        <div class="o-subject-grid__item">
            
<div class="m-subject-card a-card ">

    
    
    
    
    
    <div class="m-subject-card__content a-p-4">
        <div class="m-subject-card__header a-mb-3">
            
                    <p class="a-text a-text-xs a-text-primary a-m-0 m-subject-card__category a-uppercase a-tracking-wide a-mb-1">Training</p>
                    <h4 class="a-heading a-text-3 m-subject-card__title">Training en coaching</h4>
            
        </div>
        
        <p class="a-text a-text-2 a-m-0 m-subject-card__description a-mb-3">Teams opleiden in moderne werkwijzen en digitale vaardigheden.</p>
        
        
        <div class="m-subject-card__meta a-flex a-items-center a-gap-2 a-mb-3">
            <p class="a-text a-text-sm a-text-gray-600 a-m-0">1-5 dagen</p>
        </div>
        
        
        
        <div class="m-subject-card__tags a-flex a-gap-1 a-flex-wrap">
            
                <span class="a-tag a-text a-bg-off-white ts-label">Agile</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">Skills</span>
            
                <span class="a-tag a-text a-bg-off-white ts-label">Mindset</span>
            
        </div>
        
    </div>

</div>

        </div>
        
    
</div>
</div>