NedDev®
EN Get in touch
Home Werk
Diensten
SaaS bouwenAI developmentAPI developmentMobile app developmentGoogle Ads managementHeadless ShopifyLaravel developmentNext.js developmentReact developmentTypeScript engineeringUI/UX designSEO & AEOWebshop bouwen
Oplossingen
AI-oplossingenB2B-platformsE-commerceHorecaLead generationLogistiekOnderwijsProcesautomatiseringSaaS-platformsStartup MVPVastgoedZorg
Branches
JuridischZorgVastgoedFinanceHoreca
Regio
Den HaagRotterdamAmsterdamUtrechtEindhovenAlmereBredaArnhemNijmegenTilburgEnschedeGroningenLeidenDelftZoetermeerDen Bosch
Studio
OverWerkwijzeLabBlogContact

Japandi

Japans-Scandinavisch designsysteem: veel wit, natuurtinten van walnoot, mos en kaki, haarlijnen, kleine letters en een lichte serif. Voor interieur, meubelmakers, keramiek en rustige wellness.

Bekijk op volledig scherm ↗
Thema 10 · Japandi
Eikenhouten bank met een keramische vaas en een droge tak bij een raam aan een Utrechtse gracht

Atelier Hout & Klei · Utrecht

Bank Oudegracht

Massief eiken, geolied. Gemaakt op bestelling in onze werkplaats aan de Vaartsche Rijn. Levertijd zes weken.

€ 1.180

Japandi

Rust door weglaten. Natuurlijke tinten, ruime marges en lijnen zo dun dat je ze pas ziet als je zoekt.

Kleur

  • Achtergrond · rijstpapier#F7F4EF
  • Oppervlak · linnen#EEE8DF
  • Tekst · sumi#2E2B27
  • Gedempt · steen#6B655C
  • Lijn · 0,5 px#D9D2C6
  • Accent · walnoot#6F5B45
  • Accent 2 · mos#9EA28A
  • Signaal · kaki#B0563A

Letter

Sentient 300

Synonym voor tekst, licht en open, met ruimte tussen de regels.

40 · 22 · 15 · 11   regelafstand 1,7

Bediening

Op voorraadHandgemaaktNog 2

Past bij · interieur en meubelmakers · keramiek en ambacht · architectuur · yoga en massage · boetiekhotels

Zo gebruik je het

  1. Plak de HTML op de plek waar het onderdeel moet komen.
  2. Zet de CSS in je stylesheet. Alle klassen hebben een eigen voorvoegsel, dus niets botst met je eigen opmaak.
  3. Geen JavaScript nodig.
<!-- Japandi · NedDev · eigen werk. -->
<div class="jouw-container">
<div class="tjp"><div class="tjp__in">
  <div class="tjp__spine"><span class="tjp__vt">Thema 10 · Japandi</span><span class="tjp__seal" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round"><path d="M19.5 9.5A8 8 0 1 0 17 18"/></svg></span></div>
  <div class="tjp__show">
    <figure class="tjp__fig"><img src="https://neddev.com/lab-media/thm-japandi-1.webp" alt="Eikenhouten bank met een keramische vaas en een droge tak bij een raam aan een Utrechtse gracht" loading="lazy"></figure>
    <div class="tjp__prod">
      <p class="tjp__brand">Atelier Hout &amp; Klei · Utrecht</p>
      <p class="tjp__pt">Bank <em>Oudegracht</em></p>
      <p class="tjp__pd">Massief eiken, geolied. Gemaakt op bestelling in onze werkplaats aan de Vaartsche Rijn. Levertijd zes weken.</p>
      <div class="tjp__pf"><span class="tjp__price">€ 1.180</span><button class="tjp__btn tjp__btn--p" type="button">Bestel op maat</button></div>
    </div>
  </div>
  <div class="tjp__sys">
    <h3 class="tjp__name">Japandi</h3>
    <p class="tjp__mood">Rust door weglaten. Natuurlijke tinten, ruime marges en lijnen zo dun dat je ze pas ziet als je zoekt.</p>
    <div class="tjp__block">
      <p class="tjp__lbl">Kleur</p>
      <ul class="tjp__pal">
        <li style="--c:#F7F4EF"><i></i><span>Achtergrond · rijstpapier</span><code>#F7F4EF</code></li>
        <li style="--c:#EEE8DF"><i></i><span>Oppervlak · linnen</span><code>#EEE8DF</code></li>
        <li style="--c:#2E2B27"><i></i><span>Tekst · sumi</span><code>#2E2B27</code></li>
        <li style="--c:#6B655C"><i></i><span>Gedempt · steen</span><code>#6B655C</code></li>
        <li style="--c:#D9D2C6"><i></i><span>Lijn · 0,5 px</span><code>#D9D2C6</code></li>
        <li style="--c:#6F5B45"><i></i><span>Accent · walnoot</span><code>#6F5B45</code></li>
        <li style="--c:#9EA28A"><i></i><span>Accent 2 · mos</span><code>#9EA28A</code></li>
        <li style="--c:#B0563A"><i></i><span>Signaal · kaki</span><code>#B0563A</code></li>
      </ul>
    </div>
    <div class="tjp__block tjp__type">
      <p class="tjp__lbl">Letter</p>
      <p class="tjp__t1">Sentient 300</p>
      <p class="tjp__t2">Synonym voor tekst, licht en open, met ruimte tussen de regels.</p>
      <p class="tjp__t3">40 · 22 · 15 · 11 &nbsp; regelafstand 1,7</p>
    </div>
    <div class="tjp__block">
      <p class="tjp__lbl">Bediening</p>
      <div class="tjp__btns">
        <button class="tjp__btn tjp__btn--p" type="button">Bestel</button>
        <button class="tjp__btn tjp__btn--s" type="button">Werkplaats bezoeken</button>
        <button class="tjp__btn tjp__btn--g" type="button">Verhaal</button>
        <button class="tjp__btn tjp__btn--p is-hover" type="button">Hover</button>
      </div>
      <div class="tjp__form">
        <input class="tjp__input" type="text" value="Eline Jansen" aria-label="Naam">
        <select class="tjp__sel" aria-label="Houtsoort"><option>Eiken, geolied</option><option>Essen, gezeept</option></select>
      </div>
      <div class="tjp__badges"><span class="tjp__bdg"><i style="background:#9EA28A"></i>Op voorraad</span><span class="tjp__bdg"><i style="background:#6F5B45"></i>Handgemaakt</span><span class="tjp__bdg"><i style="background:#B0563A"></i>Nog 2</span></div>
    </div>
    <p class="tjp__fit">Past bij · interieur en meubelmakers · keramiek en ambacht · architectuur · yoga en massage · boetiekhotels</p>
  </div>
</div></div>
</div>

Meer uit thema's

Iets gezien dat je mooi vindt?

Zet het in je selectie en stuur hem op. Dan bouwen we je site eromheen, in jouw huisstijl.

Neem contact op →