CSS圆角立方体是一种常用的3D效果，通过CSS的transform属性和border-radius属性的结合使用，可以让一个平面的盒子呈现出三维的效果，同时还可以控制盒子的形态和样式，非常实用。下面我们来看看如何实现这个效果。

/*基本样式*/
.cube {
width: 200px;
height: 200px;
border-radius: 20px;
position: relative;
transform-style: preserve-3d;
}
/*前面*/
.cube .front {
width: 200px;
height: 200px;
position: absolute;
transform: translateZ(100px);
background-color: #f00;
}
/*后面*/
.cube .back {
width: 200px;
height: 200px;
position: absolute;
transform: translateZ(-100px) rotateY(180deg);
background-color: #00f;
}
/*左侧*/
.cube .left {
width: 200px;
height: 200px;
position: absolute;
transform: translateX(-100px) rotateY(-90deg);
background-color: #0f0;
}
/*右侧*/
.cube .right {
width: 200px;
height: 200px;
position: absolute;
transform: translateX(100px) rotateY(90deg);
background-color: #ff0;
}
/*顶部*/
.cube .top {
width: 200px;
height: 200px;
position: absolute;
transform: translateY(-100px) rotateX(90deg);
background-color: #f0f;
}
/*底部*/
.cube .bottom {
width: 200px;
height: 200px;
position: absolute;
transform: translateY(100px) rotateX(-90deg);
background-color: #0ff;
}

在上面的代码中，我们通过设置盒子的宽度高度和border-radius属性，创建了一个基本的立方体盒子，并且设置了它的position属性为relative，让子元素的绝对定位相对于它进行定位。

然后我们创建了6个子元素，分别代表盒子的6个面，通过设置它们的position属性为absolute，并且对它们应用不同的transform属性，能够正确的定位它们在3D空间中的位置和角度，从而呈现出圆角立方体的效果。

在使用CSS圆角立方体时，我们可以根据具体的需求，自定义盒子的形态和样式，非常灵活实用。同时，为了兼容性，我们需要在一些浏览器中添加特定的CSS前缀，具体请参考CSS文档。