{"id":30481,"date":"2023-04-05T08:25:34","date_gmt":"2023-04-05T08:25:34","guid":{"rendered":"https:\/\/codewebbarcelona.com\/tendencias-en-diseno-web-2023\/"},"modified":"2026-04-21T01:23:29","modified_gmt":"2026-04-21T01:23:29","slug":"web-design-trends-2023","status":"publish","type":"post","link":"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/","title":{"rendered":"Web Design Trends 2023"},"content":{"rendered":"

The next phase of the Internet has arrived, and it\u2019s shaping the web design trends of 2023. As always, these digital trends mirror emerging technologies and their impact on society\u2014and last year gave designers plenty of inspiration to work with.<\/p>\n

We\u2019ve seen major breakthroughs in artificial intelligence, now capable of generating its own art, while the Metaverse has brought virtual reality closer to the mainstream. Web design trends are following suit, embracing immersion, simulation, and cinematic techniques. At the same time, a global recession has sparked both a retreat from luxury and a surge in joyful, escapist experiences. All of this is unfolding against the backdrop of the \u201cGreat Now,\u201d where the Internet and mobile devices have reached unprecedented global availability. The result? Web design trends are less bound by the immediate and the local, as aesthetic innovation becomes a fast-moving, worldwide effort.<\/p>\n

Annual update: discover the 2026 web trends<\/a> redefining online design and interaction.<\/h6>\n

With all these factors at play, the following web design trends for 2023 are set to shake up the foundations of the World Wide Web.<\/p>\n

Web Design Trends 2023<\/h2>\n

Animated product reveals<\/h3>\n

Hover animations have long been a go-to for subtle microinteractions, keeping visitors passively engaged. But in 2023, web designers are taking hover effects to the next level, transforming ordinary page elements into dazzling product reveals.<\/p>\n

This trend achieves several goals at once. It enables quick navigation, letting visitors preview products instantly without clicking through to another page. By animating the product, it offers a glimpse of how it might be used. It reinforces a minimalist interface by displaying photos one at a time, keeping the page free from image clutter. It can also add a new layer of depth, animating product photos over the existing page.<\/p>\n

And finally, like most delightful interactions, these hover animations create a sense of discovery, encouraging visitors to keep exploring for more surprises.<\/p>\n

How and when to use it<\/h4>\n

Leverage this trend on sites that:<\/p>\n

    \n
  1. Target a broad audience<\/li>\n
  2. Want to showcase your company\u2019s potential<\/li>\n
  3. Seek that extra touch of personalization to stand out from the crowd<\/li>\n<\/ol>\n

    Keep in mind:<\/strong><\/p>\n

    Every project has its own unique requirements<\/p>\n

    Design and development must be seamless\u2014fluidity is key<\/p>\n

    Consider this option from the start and plan for any challenges that may arise<\/p>\n

    Websites featuring this trend<\/h4>\n

    Design by Stan Yakusevich via Dribbble<\/strong><\/p>\n

    View website<\/a><\/p>\n

    Ayond<\/b><\/p>\n

    View website<\/a><\/p>\n

    Orb-Space<\/b><\/p>\n

    View website<\/a><\/p>\n

    Scrapbook aesthetic<\/h3>\n

    Last year saw massive technological leaps, culminating in the much-anticipated launch of the James Webb Space Telescope. But with futurism often comes a longing to reconnect with the natural world. On 2023 websites, this urge is expressed through scrapbook and DIY-inspired elements.<\/p>\n

    These sites often feature doodles, handwritten lettering, sticker graphics, and cut-and-paste collages. Not only do they recreate the tactile experience of flipping through an old school magazine, but they also infuse a sense of intimacy and imperfection, in contrast to automated precision. While the handmade look stands in opposition to the slickness of high-tech trends, it doesn\u2019t deny our digital reality. Instead, these designs embrace both worlds\u2014physical and digital\u2014coexisting as one.<\/p>\n

    How and when to use it<\/h4>\n

    Leverage this trend on sites that:<\/p>\n

      \n
    1. Target a broad audience<\/li>\n
    2. Want to showcase your company\u2019s potential<\/li>\n
    3. Seek that extra touch of personalization to stand out from the crowd<\/li>\n<\/ol>\n

      Keep in mind:<\/strong><\/p>\n

      Every project has its own unique requirements<\/p>\n

      Design and development must be seamless\u2014fluidity is key<\/p>\n

      Consider this option from the start and plan for any challenges that may arise<\/p>\n

      Websites featuring this trend<\/h4>\n

      Freak Mag<\/b><\/p>\n

      View website<\/a><\/p>\n

      Plantarium<\/b><\/p>\n

      \"tendencias-dise\u00f1o-web-2023-plantarium-01\" \"tendencias-dise\u00f1o-web-2023-plantarium-01\" \"tendencias-dise\u00f1o-web-2023-plantarium-01\" \"tendencias-dise\u00f1o-web-2023-plantarium-01\" \"tendencias-dise\u00f1o-web-2023-plantarium-01\"<\/p>\n

      View website<\/a><\/p>\n

      Winnning Ponds<\/b><\/p>\n

      \"tendencias-dise\u00f1o-web-2023-winning<\/p>\n

      View website<\/a><\/p>\n

      Typographic layouts<\/h3>\n

      One of the greatest advantages of digital design is its multimedia potential\u2014text, images, video, animation, and interactive elements can all coexist in a single composition. Despite this, many web designers in 2023 are moving away from multimedia in favor of text-driven layouts.<\/p>\n

      The result is a retro print-magazine aesthetic, which may be a side effect of many publications going digital to avoid rising print costs and environmental impact. Whatever the reason, typographic layouts support efficient minimalism: these sites have something to say, and they don\u2019t waste visitors\u2019 time saying it. They also credit their audience\u2019s intelligence, recognizing that impactful words and creative text arrangements can be just as captivating as attention-grabbing visuals.<\/p>\n

      How and when to use it<\/h4>\n

      Leverage this trend on sites that:<\/p>\n

        \n
      1. Target a broad audience<\/li>\n
      2. Want to showcase your company\u2019s potential<\/li>\n
      3. Seek that extra touch of personalization to stand out from the crowd<\/li>\n<\/ol>\n

        Keep in mind:<\/strong><\/p>\n

        Every project has its own unique requirements<\/p>\n

        Design and development must be seamless\u2014fluidity is key<\/p>\n

        Consider this option from the start and plan for any challenges that may arise<\/p>\n

        Websites featuring this trend<\/h4>\n

        USSR Almanac<\/b><\/p>\n

        View website<\/a><\/p>\n

        Ukrainian Power<\/b><\/p>\n

        View website<\/a><\/p>\n

        Theud<\/b><\/p>\n

        View website<\/a><\/p>\n

        \u201990s navigation<\/h3>\n

        The retro 1990s look became a major theme in last year\u2019s web design trends, reflecting a collective nostalgia for the innocence of the early Internet. In 2023, that trend shows no sign of slowing down. Designers are now doubling down on creative nostalgia, with a special focus on navigation.<\/p>\n

        Nostalgic navigation can take the form of literal \u201990s design techniques, like pixelated desktop icons or bold color blocks in menus. It can also incorporate throwback artifacts, as seen in SIRUP\u2019s clever CD tower navigation menu. Both styles tap into sensory memory\u2014sorting through stacked cases or clicking through a now-obsolete but familiar interface.<\/p>\n

        Even without direct experience, this trend can appeal to younger users by creating a digital replica of a world they never knew. Overall, nostalgia is always a useful tool for evoking comfort, especially in challenging times. But its use in navigation also suggests that we\u2019re moving forward by looking to the past.<\/p>\n

        How and when to use it<\/h\n<\/p>\n","protected":false},"excerpt":{"rendered":"

        The next phase of the Internet has arrived, and it\u2019s shaping the web design trends of 2023. As always, these digital trends mirror emerging technologies and their impact on society\u2014and last year gave designers plenty of inspiration to work with. We\u2019ve seen major breakthroughs in artificial intelligence, now capable of generating its own art, while […]<\/p>\n","protected":false},"author":1,"featured_media":9858,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[207,208,210,134],"class_list":["post-30481","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-destacat","category-disseny-desenvolupament-web","category-inspiracio","category-disseny-grafic"],"acf":[],"yoast_head":"\nTendencias en dise\u00f1o web 2023 - Code Barcelona<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Tendencias en dise\u00f1o web 2023 - Code Barcelona\" \/>\n<meta property=\"og:description\" content=\"The next phase of the Internet has arrived, and it\u2019s shaping the web design trends of 2023. As always, these digital trends mirror emerging technologies and their impact on society\u2014and last year gave designers plenty of inspiration to work with. We\u2019ve seen major breakthroughs in artificial intelligence, now capable of generating its own art, while […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/\" \/>\n<meta property=\"og:site_name\" content=\"Code Barcelona\" \/>\n<meta property=\"article:published_time\" content=\"2023-04-05T08:25:34+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-04-21T01:23:29+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2023\/04\/tendencias-diseC3B1o-web-2023-the-epitomy-of-beauty-08-1.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1400\" \/>\n\t<meta property=\"og:image:height\" content=\"875\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"cd26Bc\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"cd26Bc\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/\"},\"author\":{\"name\":\"cd26Bc\",\"@id\":\"https:\/\/codewebbarcelona.com\/en\/#\/schema\/person\/3af5f44aaf0de2919e9225aa5ca32567\"},\"headline\":\"Web Design Trends 2023\",\"datePublished\":\"2023-04-05T08:25:34+00:00\",\"dateModified\":\"2026-04-21T01:23:29+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/\"},\"wordCount\":1248,\"image\":{\"@id\":\"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2023\/04\/tendencias-diseC3B1o-web-2023-the-epitomy-of-beauty-08-1.jpg\",\"articleSection\":[\"Destacat\",\"Disseny i desenvolupament web\",\"Inspiraci\u00f3\",\"Dise\u00f1o gr\u00e1fico\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/\",\"url\":\"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/\",\"name\":\"Tendencias en dise\u00f1o web 2023 - Code Barcelona\",\"isPartOf\":{\"@id\":\"https:\/\/codewebbarcelona.com\/en\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2023\/04\/tendencias-diseC3B1o-web-2023-the-epitomy-of-beauty-08-1.jpg\",\"datePublished\":\"2023-04-05T08:25:34+00:00\",\"dateModified\":\"2026-04-21T01:23:29+00:00\",\"author\":{\"@id\":\"https:\/\/codewebbarcelona.com\/en\/#\/schema\/person\/3af5f44aaf0de2919e9225aa5ca32567\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/#primaryimage\",\"url\":\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2023\/04\/tendencias-diseC3B1o-web-2023-the-epitomy-of-beauty-08-1.jpg\",\"contentUrl\":\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2023\/04\/tendencias-diseC3B1o-web-2023-the-epitomy-of-beauty-08-1.jpg\",\"width\":1400,\"height\":875},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/codewebbarcelona.com\/en\/#website\",\"url\":\"https:\/\/codewebbarcelona.com\/en\/\",\"name\":\"Code Barcelona\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/codewebbarcelona.com\/en\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/codewebbarcelona.com\/en\/#\/schema\/person\/3af5f44aaf0de2919e9225aa5ca32567\",\"name\":\"cd26Bc\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/secure.gravatar.com\/avatar\/b904e836584635855eaa0ee2922bae4fe2aa94ffb558048dcc5dac5f98f0fadc?s=96&d=mm&r=g\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/b904e836584635855eaa0ee2922bae4fe2aa94ffb558048dcc5dac5f98f0fadc?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/b904e836584635855eaa0ee2922bae4fe2aa94ffb558048dcc5dac5f98f0fadc?s=96&d=mm&r=g\",\"caption\":\"cd26Bc\"},\"sameAs\":[\"https:\/\/codewebbarcelona.com\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Tendencias en dise\u00f1o web 2023 - Code Barcelona","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/","og_locale":"en_US","og_type":"article","og_title":"Tendencias en dise\u00f1o web 2023 - Code Barcelona","og_description":"The next phase of the Internet has arrived, and it\u2019s shaping the web design trends of 2023. As always, these digital trends mirror emerging technologies and their impact on society\u2014and last year gave designers plenty of inspiration to work with. We\u2019ve seen major breakthroughs in artificial intelligence, now capable of generating its own art, while […]","og_url":"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/","og_site_name":"Code Barcelona","article_published_time":"2023-04-05T08:25:34+00:00","article_modified_time":"2026-04-21T01:23:29+00:00","og_image":[{"width":1400,"height":875,"url":"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2023\/04\/tendencias-diseC3B1o-web-2023-the-epitomy-of-beauty-08-1.jpg","type":"image\/jpeg"}],"author":"cd26Bc","twitter_card":"summary_large_image","twitter_misc":{"Written by":"cd26Bc","Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/#article","isPartOf":{"@id":"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/"},"author":{"name":"cd26Bc","@id":"https:\/\/codewebbarcelona.com\/en\/#\/schema\/person\/3af5f44aaf0de2919e9225aa5ca32567"},"headline":"Web Design Trends 2023","datePublished":"2023-04-05T08:25:34+00:00","dateModified":"2026-04-21T01:23:29+00:00","mainEntityOfPage":{"@id":"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/"},"wordCount":1248,"image":{"@id":"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/#primaryimage"},"thumbnailUrl":"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2023\/04\/tendencias-diseC3B1o-web-2023-the-epitomy-of-beauty-08-1.jpg","articleSection":["Destacat","Disseny i desenvolupament web","Inspiraci\u00f3","Dise\u00f1o gr\u00e1fico"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/","url":"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/","name":"Tendencias en dise\u00f1o web 2023 - Code Barcelona","isPartOf":{"@id":"https:\/\/codewebbarcelona.com\/en\/#website"},"primaryImageOfPage":{"@id":"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/#primaryimage"},"image":{"@id":"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/#primaryimage"},"thumbnailUrl":"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2023\/04\/tendencias-diseC3B1o-web-2023-the-epitomy-of-beauty-08-1.jpg","datePublished":"2023-04-05T08:25:34+00:00","dateModified":"2026-04-21T01:23:29+00:00","author":{"@id":"https:\/\/codewebbarcelona.com\/en\/#\/schema\/person\/3af5f44aaf0de2919e9225aa5ca32567"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/codewebbarcelona.com\/en\/blog\/web-design-trends-2023\/#primaryimage","url":"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2023\/04\/tendencias-diseC3B1o-web-2023-the-epitomy-of-beauty-08-1.jpg","contentUrl":"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2023\/04\/tendencias-diseC3B1o-web-2023-the-epitomy-of-beauty-08-1.jpg","width":1400,"height":875},{"@type":"WebSite","@id":"https:\/\/codewebbarcelona.com\/en\/#website","url":"https:\/\/codewebbarcelona.com\/en\/","name":"Code Barcelona","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/codewebbarcelona.com\/en\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/codewebbarcelona.com\/en\/#\/schema\/person\/3af5f44aaf0de2919e9225aa5ca32567","name":"cd26Bc","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/b904e836584635855eaa0ee2922bae4fe2aa94ffb558048dcc5dac5f98f0fadc?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/b904e836584635855eaa0ee2922bae4fe2aa94ffb558048dcc5dac5f98f0fadc?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/b904e836584635855eaa0ee2922bae4fe2aa94ffb558048dcc5dac5f98f0fadc?s=96&d=mm&r=g","caption":"cd26Bc"},"sameAs":["https:\/\/codewebbarcelona.com"]}]}},"_links":{"self":[{"href":"https:\/\/codewebbarcelona.com\/en\/wp-json\/wp\/v2\/posts\/30481","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/codewebbarcelona.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/codewebbarcelona.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/codewebbarcelona.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/codewebbarcelona.com\/en\/wp-json\/wp\/v2\/comments?post=30481"}],"version-history":[{"count":2,"href":"https:\/\/codewebbarcelona.com\/en\/wp-json\/wp\/v2\/posts\/30481\/revisions"}],"predecessor-version":[{"id":30611,"href":"https:\/\/codewebbarcelona.com\/en\/wp-json\/wp\/v2\/posts\/30481\/revisions\/30611"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/codewebbarcelona.com\/en\/wp-json\/wp\/v2\/media\/9858"}],"wp:attachment":[{"href":"https:\/\/codewebbarcelona.com\/en\/wp-json\/wp\/v2\/media?parent=30481"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/codewebbarcelona.com\/en\/wp-json\/wp\/v2\/categories?post=30481"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}