# My custom css for the new propeties feature!

**URL:** <https://forum.obsidian.md/t/my-custom-css-for-the-new-propeties-feature/66161>\
**Category:** Themes & CSS snippets\
**Tags:** properties, custom-css\
**Created:** [September 1, 2023, 12:15am UTC](https://forum.obsidian.md/t/my-custom-css-for-the-new-propeties-feature/66161 "2023-09-01T00:15:28Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![jorgemrtr](https://forum.obsidian.md/user_avatar/forum.obsidian.md/jorgemrtr/32/22860_2.png) [@jorgemrtr](https://forum.obsidian.md/u/jorgemrtr)\
**Post date:** [September 1, 2023, 12:15am UTC](https://forum.obsidian.md/t/my-custom-css-for-the-new-propeties-feature/66161/1 "2023-09-01T00:15:29Z")

</div>

![imagen](https://forum.obsidian.md/uploads/default/original/3X/1/b/1b4de78d1f55345c86be634e06a8357f568ea831.png)

This is how my obsidian looks with the new update. I would love to see what other people have done in css with the new feature!

[custom-properties.css](https://forum.obsidian.md/uploads/short-url/zTMc287CthuOon3d2D3F4IfWNLj.css) (483 Bytes)

---

<div class="post-metadata">

**Author:** ![jorgemrtr](https://forum.obsidian.md/user_avatar/forum.obsidian.md/jorgemrtr/32/22860_2.png) [@jorgemrtr](https://forum.obsidian.md/u/jorgemrtr)\
**Post date:** [September 4, 2023, 6:38pm UTC](https://forum.obsidian.md/t/my-custom-css-for-the-new-propeties-feature/66161/2 "2023-09-04T18:38:32Z")

</div>

Updated CSS code

```auto
/* hides "Properties" title, also hides dropdown */
.metadata-properties-heading {
  display: none;
  
}

.metadata-properties, .metadata-properties *, .metadata-add-button, .metadata-properties-heading {
  font-family: var(--font-monospace), "azeret mono", "space mono", "jetbrains mono";
}

body {
  --metadata-label-font-weight: 500;
  --metadata-label-text-color: #bdc;
  --metadata-label-font-size: 14px;
  --metadata-input-font-size: 14px;
  --metadata-gap: 0;
  --metadata-padding: 0 0 .25rem 0;
  --metadata-label-width: max(22.5%, 8rem);
  --metadata-input-height: calc(var(--metadata-label-font-size) * 2.1);
}

.metadata-property-key .metadata-property-icon {
  --icon-color: #bdc;
  --icon-size: 1rem;
}

.metadata-container {
  border-bottom: dashed .2rem var(--background-modifier-border);
  margin-bottom: 1.5rem;
  /* for minimal theme */
  --input-height: var(--metadata-input-height);
}

```